{"remainingRequest":"D:\\Hjm项目\\suyiScreen\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\Hjm项目\\suyiScreen\\node_modules\\@jiaminghi\\data-view\\lib\\components\\activeRingChart\\src\\main.vue?vue&type=script&lang=js&","dependencies":[{"path":"D:\\Hjm项目\\suyiScreen\\node_modules\\@jiaminghi\\data-view\\lib\\components\\activeRingChart\\src\\main.vue","mtime":499162500000},{"path":"D:\\Hjm项目\\suyiScreen\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\suyiScreen\\node_modules\\babel-loader\\lib\\index.js","mtime":499162500000},{"path":"D:\\Hjm项目\\suyiScreen\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\suyiScreen\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:Ly8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KCmltcG9ydCBDaGFydHMgZnJvbSAnQGppYW1pbmdoaS9jaGFydHMnCgppbXBvcnQgZHZEaWdpdGFsRmxvcCBmcm9tICcuLi8uLi9kaWdpdGFsRmxvcC9zcmMvbWFpbi52dWUnCgppbXBvcnQgeyBkZWVwTWVyZ2UgfSBmcm9tICdAamlhbWluZ2hpL2NoYXJ0cy9saWIvdXRpbC9pbmRleCcKCmltcG9ydCB7IGRlZXBDbG9uZSB9IGZyb20gJ0BqaWFtaW5naGkvYy1yZW5kZXIvbGliL3BsdWdpbi91dGlsJwoKZXhwb3J0IGRlZmF1bHQgewogIG5hbWU6ICdEdkFjdGl2ZVJpbmdDaGFydCcsCiAgY29tcG9uZW50czogewogICAgZHZEaWdpdGFsRmxvcAogIH0sCiAgcHJvcHM6IHsKICAgIGNvbmZpZzogewogICAgICB0eXBlOiBPYmplY3QsCiAgICAgIGRlZmF1bHQ6ICgpID0+ICh7fSkKICAgIH0KICB9LAogIGRhdGEgKCkgewogICAgcmV0dXJuIHsKICAgICAgZGVmYXVsdENvbmZpZzogewogICAgICAgIC8qKgogICAgICAgICAqIEBkZXNjcmlwdGlvbiBSaW5nIHJhZGl1cwogICAgICAgICAqIEB0eXBlIHtTdHJpbmd8TnVtYmVyfQogICAgICAgICAqIEBkZWZhdWx0IHJhZGl1cyA9ICc1MCUnCiAgICAgICAgICogQGV4YW1wbGUgcmFkaXVzID0gJzUwJScgfCAxMDAKICAgICAgICAgKi8KICAgICAgICByYWRpdXM6ICc1MCUnLAogICAgICAgIC8qKgogICAgICAgICAqIEBkZXNjcmlwdGlvbiBBY3RpdmUgcmluZyByYWRpdXMKICAgICAgICAgKiBAdHlwZSB7U3RyaW5nfE51bWJlcn0KICAgICAgICAgKiBAZGVmYXVsdCBhY3RpdmVSYWRpdXMgPSAnNTUlJwogICAgICAgICAqIEBleGFtcGxlIGFjdGl2ZVJhZGl1cyA9ICc1NSUnIHwgMTEwCiAgICAgICAgICovCiAgICAgICAgYWN0aXZlUmFkaXVzOiAnNTUlJywKICAgICAgICAvKioKICAgICAgICAgKiBAZGVzY3JpcHRpb24gUmluZyBkYXRhCiAgICAgICAgICogQHR5cGUge0FycmF5PE9iamVjdD59CiAgICAgICAgICogQGRlZmF1bHQgZGF0YSA9IFt7IG5hbWU6ICcnLCB2YWx1ZTogMCB9XQogICAgICAgICAqLwogICAgICAgIGRhdGE6IFt7IG5hbWU6ICcnLCB2YWx1ZTogMCB9XSwKICAgICAgICAvKioKICAgICAgICAgKiBAZGVzY3JpcHRpb24gUmluZyBsaW5lIHdpZHRoCiAgICAgICAgICogQHR5cGUge051bWJlcn0KICAgICAgICAgKiBAZGVmYXVsdCBsaW5lV2lkdGggPSAyMAogICAgICAgICAqLwogICAgICAgIGxpbmVXaWR0aDogMjAsCiAgICAgICAgLyoqCiAgICAgICAgICogQGRlc2NyaXB0aW9uIEFjdGl2ZSB0aW1lIGdhcCAobXMpCiAgICAgICAgICogQHR5cGUge051bWJlcn0KICAgICAgICAgKiBAZGVmYXVsdCBhY3RpdmVUaW1lR2FwID0gMzAwMAogICAgICAgICAqLwogICAgICAgIGFjdGl2ZVRpbWVHYXA6IDMwMDAsCiAgICAgICAgLyoqCiAgICAgICAgICogQGRlc2NyaXB0aW9uIFJpbmcgY29sb3IgKGhleHxyZ2J8cmdiYXxjb2xvciBrZXl3b3JkcykKICAgICAgICAgKiBAdHlwZSB7QXJyYXk8U3RyaW5nPn0KICAgICAgICAgKiBAZGVmYXVsdCBjb2xvciA9IFtDaGFydHMgRGVmYXVsdCBDb2xvcl0KICAgICAgICAgKiBAZXhhbXBsZSBjb2xvciA9IFsnIzAwMCcsICdyZ2IoMCwgMCwgMCknLCAncmdiYSgwLCAwLCAwLCAxKScsICdyZWQnXQogICAgICAgICAqLwogICAgICAgIGNvbG9yOiBbXSwKICAgICAgICAvKioKICAgICAgICAgKiBAZGVzY3JpcHRpb24gRGlnaXRhbCBmbG9wIHN0eWxlCiAgICAgICAgICogQHR5cGUge09iamVjdH0KICAgICAgICAgKi8KICAgICAgICBkaWdpdGFsRmxvcFN0eWxlOiB7CiAgICAgICAgICBmb250U2l6ZTogMjUsCiAgICAgICAgICBmaWxsOiAnI2ZmZicKICAgICAgICB9LAogICAgICAgIC8qKgogICAgICAgICAqIEBkZXNjcmlwdGlvbiBEaWdpdGFsIGZsb3AgdG9GaXhlZAogICAgICAgICAqIEB0eXBlIHtOdW1iZXJ9CiAgICAgICAgICovCiAgICAgICAgZGlnaXRhbEZsb3BUb0ZpeGVkOiAwLAogICAgICAgIC8qKgogICAgICAgICAqIEBkZXNjcmlwdGlvbiBDUmVuZGVyIGFuaW1hdGlvbkN1cnZlCiAgICAgICAgICogQHR5cGUge1N0cmluZ30KICAgICAgICAgKiBAZGVmYXVsdCBhbmltYXRpb25DdXJ2ZSA9ICdlYXNlT3V0Q3ViaWMnCiAgICAgICAgICovCiAgICAgICAgYW5pbWF0aW9uQ3VydmU6ICdlYXNlT3V0Q3ViaWMnLAogICAgICAgIC8qKgogICAgICAgICAqIEBkZXNjcmlwdGlvbiBDUmVuZGVyIGFuaW1hdGlvbkZyYW1lCiAgICAgICAgICogQHR5cGUge1N0cmluZ30KICAgICAgICAgKiBAZGVmYXVsdCBhbmltYXRpb25GcmFtZSA9IDUwCiAgICAgICAgICovCiAgICAgICAgYW5pbWF0aW9uRnJhbWU6IDUwCiAgICAgIH0sCgogICAgICBtZXJnZWRDb25maWc6IG51bGwsCgogICAgICBjaGFydDogbnVsbCwKCiAgICAgIGFjdGl2ZUluZGV4OiAwLAoKICAgICAgYW5pbWF0aW9uSGFuZGxlcjogJycKICAgIH0KICB9LAogIGNvbXB1dGVkOiB7CiAgICBkaWdpdGFsRmxvcCAoKSB7CiAgICAgIGNvbnN0IHsgbWVyZ2VkQ29uZmlnLCBhY3RpdmVJbmRleCB9ID0gdGhpcwoKICAgICAgaWYgKCFtZXJnZWRDb25maWcpIHJldHVybiB7fQoKICAgICAgY29uc3QgeyBkaWdpdGFsRmxvcFN0eWxlLCBkaWdpdGFsRmxvcFRvRml4ZWQsIGRhdGEgfSA9IG1lcmdlZENvbmZpZwoKICAgICAgY29uc3QgdmFsdWUgPSBkYXRhLm1hcCgoeyB2YWx1ZSB9KSA9PiB2YWx1ZSkKCiAgICAgIGNvbnN0IHN1bSA9IHZhbHVlLnJlZHVjZSgoYWxsLCB2KSA9PiBhbGwgKyB2LCAwKQoKICAgICAgY29uc3QgcGVyY2VudCA9IHBhcnNlRmxvYXQodmFsdWVbYWN0aXZlSW5kZXhdIC8gc3VtICogMTAwKSB8fCAwCgogICAgICByZXR1cm4gewogICAgICAgIGNvbnRlbnQ6ICd7bnR9JScsCiAgICAgICAgbnVtYmVyOiBbcGVyY2VudF0sCiAgICAgICAgc3R5bGU6IGRpZ2l0YWxGbG9wU3R5bGUsCiAgICAgICAgdG9GaXhlZDogZGlnaXRhbEZsb3BUb0ZpeGVkCiAgICAgIH0KICAgIH0sCiAgICByaW5nTmFtZSAoKSB7CiAgICAgIGNvbnN0IHsgbWVyZ2VkQ29uZmlnLCBhY3RpdmVJbmRleCB9ID0gdGhpcwoKICAgICAgaWYgKCFtZXJnZWRDb25maWcpIHJldHVybiAnJwoKICAgICAgcmV0dXJuIG1lcmdlZENvbmZpZy5kYXRhW2FjdGl2ZUluZGV4XS5uYW1lCiAgICB9LAogICAgZm9udFNpemUgKCkgewogICAgICBjb25zdCB7IG1lcmdlZENvbmZpZyB9ID0gdGhpcwoKICAgICAgaWYgKCFtZXJnZWRDb25maWcpIHJldHVybiAnJwoKICAgICAgcmV0dXJuIGBmb250LXNpemU6ICR7bWVyZ2VkQ29uZmlnLmRpZ2l0YWxGbG9wU3R5bGUuZm9udFNpemV9cHg7YAogICAgfQogIH0sCiAgd2F0Y2g6IHsKICAgIGNvbmZpZyAoKSB7CiAgICAgIGNvbnN0IHsgYW5pbWF0aW9uSGFuZGxlciwgbWVyZ2VDb25maWcsIHNldFJpbmdPcHRpb24gfSA9IHRoaXMKCiAgICAgIGNsZWFyVGltZW91dChhbmltYXRpb25IYW5kbGVyKQoKICAgICAgdGhpcy5hY3RpdmVJbmRleCA9IDAKCiAgICAgIG1lcmdlQ29uZmlnKCkKCiAgICAgIHNldFJpbmdPcHRpb24oKQogICAgfQogIH0sCiAgbWV0aG9kczogewogICAgaW5pdCAoKSB7CiAgICAgIGNvbnN0IHsgaW5pdENoYXJ0LCBtZXJnZUNvbmZpZywgc2V0UmluZ09wdGlvbiB9ID0gdGhpcwoKICAgICAgaW5pdENoYXJ0KCkKCiAgICAgIG1lcmdlQ29uZmlnKCkKCiAgICAgIHNldFJpbmdPcHRpb24oKQogICAgfSwKICAgIGluaXRDaGFydCAoKSB7CiAgICAgIGNvbnN0IHsgJHJlZnMgfSA9IHRoaXMKCiAgICAgIHRoaXMuY2hhcnQgPSBuZXcgQ2hhcnRzKCRyZWZzWydhY3RpdmUtcmluZy1jaGFydCddKQogICAgfSwKICAgIG1lcmdlQ29uZmlnICgpIHsKICAgICAgY29uc3QgeyBkZWZhdWx0Q29uZmlnLCBjb25maWcgfSA9IHRoaXMKCiAgICAgIHRoaXMubWVyZ2VkQ29uZmlnID0gZGVlcE1lcmdlKGRlZXBDbG9uZShkZWZhdWx0Q29uZmlnLCB0cnVlKSwgY29uZmlnIHx8IHt9KQogICAgfSwKICAgIHNldFJpbmdPcHRpb24gKCkgewogICAgICBjb25zdCB7IGdldFJpbmdPcHRpb24sIGNoYXJ0LCByaW5nQW5pbWF0aW9uIH0gPSB0aGlzCgogICAgICBjb25zdCBvcHRpb24gPSBnZXRSaW5nT3B0aW9uKCkKCiAgICAgIGNoYXJ0LnNldE9wdGlvbihvcHRpb24sIHRydWUpCgogICAgICByaW5nQW5pbWF0aW9uKCkKICAgIH0sCiAgICBnZXRSaW5nT3B0aW9uICgpIHsKICAgICAgY29uc3QgeyBtZXJnZWRDb25maWcsIGdldFJlYWxSYWRpdXMgfSA9IHRoaXMKCiAgICAgIGNvbnN0IHJhZGl1cyA9IGdldFJlYWxSYWRpdXMoKQoKICAgICAgbWVyZ2VkQ29uZmlnLmRhdGEuZm9yRWFjaChkYXRhSXRlbSA9PiB7CiAgICAgICAgZGF0YUl0ZW0ucmFkaXVzID0gcmFkaXVzCiAgICAgIH0pCgogICAgICByZXR1cm4gewogICAgICAgIHNlcmllczogWwogICAgICAgICAgewogICAgICAgICAgICB0eXBlOiAncGllJywKICAgICAgICAgICAgLi4ubWVyZ2VkQ29uZmlnLAogICAgICAgICAgICBvdXRzaWRlTGFiZWw6IHsKICAgICAgICAgICAgICBzaG93OiBmYWxzZQogICAgICAgICAgICB9CiAgICAgICAgICB9CiAgICAgICAgXSwKICAgICAgICBjb2xvcjogbWVyZ2VkQ29uZmlnLmNvbG9yCiAgICAgIH0KICAgIH0sCiAgICBnZXRSZWFsUmFkaXVzIChhY3RpdmUgPSBmYWxzZSkgewogICAgICBjb25zdCB7IG1lcmdlZENvbmZpZywgY2hhcnQgfSA9IHRoaXMKCiAgICAgIGNvbnN0IHsgcmFkaXVzLCBhY3RpdmVSYWRpdXMsIGxpbmVXaWR0aCB9ID0gbWVyZ2VkQ29uZmlnCgogICAgICBjb25zdCBtYXhSYWRpdXMgPSBNYXRoLm1pbiguLi5jaGFydC5yZW5kZXIuYXJlYSkgLyAyCgogICAgICBjb25zdCBoYWxmTGluZVdpZHRoID0gbGluZVdpZHRoIC8gMgoKICAgICAgbGV0IHJlYWxSYWRpdXMgPSBhY3RpdmUgPyBhY3RpdmVSYWRpdXMgOiByYWRpdXMKCiAgICAgIGlmICh0eXBlb2YgcmVhbFJhZGl1cyAhPT0gJ251bWJlcicpIHJlYWxSYWRpdXMgPSBwYXJzZUludChyZWFsUmFkaXVzKSAvIDEwMCAqIG1heFJhZGl1cwoKICAgICAgY29uc3QgaW5zaWRlUmFkaXVzID0gcmVhbFJhZGl1cyAtIGhhbGZMaW5lV2lkdGgKICAgICAgY29uc3Qgb3V0U2lkZVJhZGl1cyA9IHJlYWxSYWRpdXMgKyBoYWxmTGluZVdpZHRoCgogICAgICByZXR1cm4gW2luc2lkZVJhZGl1cywgb3V0U2lkZVJhZGl1c10KICAgIH0sCiAgICByaW5nQW5pbWF0aW9uICgpIHsKICAgICAgbGV0IHsgYWN0aXZlSW5kZXgsIGdldFJpbmdPcHRpb24sIGNoYXJ0LCBnZXRSZWFsUmFkaXVzIH0gPSB0aGlzCgogICAgICBjb25zdCByYWRpdXMgPSBnZXRSZWFsUmFkaXVzKCkKICAgICAgY29uc3QgYWN0aXZlID0gZ2V0UmVhbFJhZGl1cyh0cnVlKQoKICAgICAgY29uc3Qgb3B0aW9uID0gZ2V0UmluZ09wdGlvbigpCgogICAgICBjb25zdCB7IGRhdGEgfSA9IG9wdGlvbi5zZXJpZXNbMF0KCiAgICAgIGRhdGEuZm9yRWFjaCgoZGF0YUl0ZW0sIGkpID0+IHsKICAgICAgICBpZiAoaSA9PT0gYWN0aXZlSW5kZXgpIHsKICAgICAgICAgIGRhdGFJdGVtLnJhZGl1cyA9IGFjdGl2ZQogICAgICAgIH0gZWxzZSB7CiAgICAgICAgICBkYXRhSXRlbS5yYWRpdXMgPSByYWRpdXMKICAgICAgICB9CiAgICAgIH0pCgogICAgICBjaGFydC5zZXRPcHRpb24ob3B0aW9uLCB0cnVlKQoKICAgICAgY29uc3QgeyBhY3RpdmVUaW1lR2FwIH0gPSBvcHRpb24uc2VyaWVzWzBdCgogICAgICB0aGlzLmFuaW1hdGlvbkhhbmRsZXIgPSBzZXRUaW1lb3V0KGZvbyA9PiB7CiAgICAgICAgYWN0aXZlSW5kZXggKz0gMQoKICAgICAgICBpZiAoYWN0aXZlSW5kZXggPj0gZGF0YS5sZW5ndGgpIGFjdGl2ZUluZGV4ID0gMAoKICAgICAgICB0aGlzLmFjdGl2ZUluZGV4ID0gYWN0aXZlSW5kZXgKCiAgICAgICAgdGhpcy5yaW5nQW5pbWF0aW9uKCkKICAgICAgfSwgYWN0aXZlVGltZUdhcCkKICAgIH0KICB9LAogIG1vdW50ZWQgKCkgewogICAgY29uc3QgeyBpbml0IH0gPSB0aGlzCgogICAgaW5pdCgpCiAgfSwKICBiZWZvcmVEZXN0cm95ICgpIHsKICAgIGNvbnN0IHsgYW5pbWF0aW9uSGFuZGxlciB9ID0gdGhpcwoKICAgIGNsZWFyVGltZW91dChhbmltYXRpb25IYW5kbGVyKQogIH0KfQo="},{"version":3,"sources":["main.vue"],"names":[],"mappings":";;;;;;;;;;;AAWA;;AAEA;;AAEA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;;AAEA;;AAEA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;;AAEA;;AAEA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;;AAEA;;AAEA;;AAEA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;;AAEA;AACA;;AAEA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA","file":"main.vue","sourceRoot":"node_modules/@jiaminghi/data-view/lib/components/activeRingChart/src","sourcesContent":["<template>\n  <div class=\"dv-active-ring-chart\">\n    <div class=\"active-ring-chart-container\" ref=\"active-ring-chart\" />\n    <div class=\"active-ring-info\">\n      <dv-digital-flop :config=\"digitalFlop\" />\n      <div class=\"active-ring-name\" :style=\"fontSize\">{{ ringName }}</div>\n    </div>\n  </div>\n</template>\n\n<script>\nimport Charts from '@jiaminghi/charts'\n\nimport dvDigitalFlop from '../../digitalFlop/src/main.vue'\n\nimport { deepMerge } from '@jiaminghi/charts/lib/util/index'\n\nimport { deepClone } from '@jiaminghi/c-render/lib/plugin/util'\n\nexport default {\n  name: 'DvActiveRingChart',\n  components: {\n    dvDigitalFlop\n  },\n  props: {\n    config: {\n      type: Object,\n      default: () => ({})\n    }\n  },\n  data () {\n    return {\n      defaultConfig: {\n        /**\n         * @description Ring radius\n         * @type {String|Number}\n         * @default radius = '50%'\n         * @example radius = '50%' | 100\n         */\n        radius: '50%',\n        /**\n         * @description Active ring radius\n         * @type {String|Number}\n         * @default activeRadius = '55%'\n         * @example activeRadius = '55%' | 110\n         */\n        activeRadius: '55%',\n        /**\n         * @description Ring data\n         * @type {Array<Object>}\n         * @default data = [{ name: '', value: 0 }]\n         */\n        data: [{ name: '', value: 0 }],\n        /**\n         * @description Ring line width\n         * @type {Number}\n         * @default lineWidth = 20\n         */\n        lineWidth: 20,\n        /**\n         * @description Active time gap (ms)\n         * @type {Number}\n         * @default activeTimeGap = 3000\n         */\n        activeTimeGap: 3000,\n        /**\n         * @description Ring color (hex|rgb|rgba|color keywords)\n         * @type {Array<String>}\n         * @default color = [Charts Default Color]\n         * @example color = ['#000', 'rgb(0, 0, 0)', 'rgba(0, 0, 0, 1)', 'red']\n         */\n        color: [],\n        /**\n         * @description Digital flop style\n         * @type {Object}\n         */\n        digitalFlopStyle: {\n          fontSize: 25,\n          fill: '#fff'\n        },\n        /**\n         * @description Digital flop toFixed\n         * @type {Number}\n         */\n        digitalFlopToFixed: 0,\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      chart: null,\n\n      activeIndex: 0,\n\n      animationHandler: ''\n    }\n  },\n  computed: {\n    digitalFlop () {\n      const { mergedConfig, activeIndex } = this\n\n      if (!mergedConfig) return {}\n\n      const { digitalFlopStyle, digitalFlopToFixed, data } = mergedConfig\n\n      const value = data.map(({ value }) => value)\n\n      const sum = value.reduce((all, v) => all + v, 0)\n\n      const percent = parseFloat(value[activeIndex] / sum * 100) || 0\n\n      return {\n        content: '{nt}%',\n        number: [percent],\n        style: digitalFlopStyle,\n        toFixed: digitalFlopToFixed\n      }\n    },\n    ringName () {\n      const { mergedConfig, activeIndex } = this\n\n      if (!mergedConfig) return ''\n\n      return mergedConfig.data[activeIndex].name\n    },\n    fontSize () {\n      const { mergedConfig } = this\n\n      if (!mergedConfig) return ''\n\n      return `font-size: ${mergedConfig.digitalFlopStyle.fontSize}px;`\n    }\n  },\n  watch: {\n    config () {\n      const { animationHandler, mergeConfig, setRingOption } = this\n\n      clearTimeout(animationHandler)\n\n      this.activeIndex = 0\n\n      mergeConfig()\n\n      setRingOption()\n    }\n  },\n  methods: {\n    init () {\n      const { initChart, mergeConfig, setRingOption } = this\n\n      initChart()\n\n      mergeConfig()\n\n      setRingOption()\n    },\n    initChart () {\n      const { $refs } = this\n\n      this.chart = new Charts($refs['active-ring-chart'])\n    },\n    mergeConfig () {\n      const { defaultConfig, config } = this\n\n      this.mergedConfig = deepMerge(deepClone(defaultConfig, true), config || {})\n    },\n    setRingOption () {\n      const { getRingOption, chart, ringAnimation } = this\n\n      const option = getRingOption()\n\n      chart.setOption(option, true)\n\n      ringAnimation()\n    },\n    getRingOption () {\n      const { mergedConfig, getRealRadius } = this\n\n      const radius = getRealRadius()\n\n      mergedConfig.data.forEach(dataItem => {\n        dataItem.radius = radius\n      })\n\n      return {\n        series: [\n          {\n            type: 'pie',\n            ...mergedConfig,\n            outsideLabel: {\n              show: false\n            }\n          }\n        ],\n        color: mergedConfig.color\n      }\n    },\n    getRealRadius (active = false) {\n      const { mergedConfig, chart } = this\n\n      const { radius, activeRadius, lineWidth } = mergedConfig\n\n      const maxRadius = Math.min(...chart.render.area) / 2\n\n      const halfLineWidth = lineWidth / 2\n\n      let realRadius = active ? activeRadius : radius\n\n      if (typeof realRadius !== 'number') realRadius = parseInt(realRadius) / 100 * maxRadius\n\n      const insideRadius = realRadius - halfLineWidth\n      const outSideRadius = realRadius + halfLineWidth\n\n      return [insideRadius, outSideRadius]\n    },\n    ringAnimation () {\n      let { activeIndex, getRingOption, chart, getRealRadius } = this\n\n      const radius = getRealRadius()\n      const active = getRealRadius(true)\n\n      const option = getRingOption()\n\n      const { data } = option.series[0]\n\n      data.forEach((dataItem, i) => {\n        if (i === activeIndex) {\n          dataItem.radius = active\n        } else {\n          dataItem.radius = radius\n        }\n      })\n\n      chart.setOption(option, true)\n\n      const { activeTimeGap } = option.series[0]\n\n      this.animationHandler = setTimeout(foo => {\n        activeIndex += 1\n\n        if (activeIndex >= data.length) activeIndex = 0\n\n        this.activeIndex = activeIndex\n\n        this.ringAnimation()\n      }, activeTimeGap)\n    }\n  },\n  mounted () {\n    const { init } = this\n\n    init()\n  },\n  beforeDestroy () {\n    const { animationHandler } = this\n\n    clearTimeout(animationHandler)\n  }\n}\n</script>"]}]}