1 line
17 KiB
JSON
1 line
17 KiB
JSON
{"remainingRequest":"D:\\Hjm项目\\suyiScreen\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\Hjm项目\\suyiScreen\\node_modules\\@jiaminghi\\data-view\\lib\\components\\waterLevelPond\\src\\main.vue?vue&type=script&lang=js&","dependencies":[{"path":"D:\\Hjm项目\\suyiScreen\\node_modules\\@jiaminghi\\data-view\\lib\\components\\waterLevelPond\\src\\main.vue","mtime":499162500000},{"path":"D:\\Hjm项目\\suyiScreen\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\Hjm项目\\suyiScreen\\node_modules\\thread-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:Ly8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KCmltcG9ydCB7IGRlZXBNZXJnZSB9IGZyb20gJ0BqaWFtaW5naGkvY2hhcnRzL2xpYi91dGlsL2luZGV4JwoKaW1wb3J0IHsgZGVlcENsb25lIH0gZnJvbSAnQGppYW1pbmdoaS9jLXJlbmRlci9saWIvcGx1Z2luL3V0aWwnCgppbXBvcnQgQ1JlbmRlciBmcm9tICdAamlhbWluZ2hpL2MtcmVuZGVyJwoKZXhwb3J0IGRlZmF1bHQgewogIG5hbWU6ICdEdldhdGVyTGV2ZWxQb25kJywKICBwcm9wczogewogICAgY29uZmlnOiBPYmplY3QsCiAgICBkZWZhdWx0OiAoKSA9PiAoe30pCiAgfSwKICBkYXRhICgpIHsKICAgIGNvbnN0IHRpbWVzdGFtcCA9IERhdGUubm93KCkKICAgIHJldHVybiB7CiAgICAgIGdyYWRpZW50SWQ6IGB3YXRlci1sZXZlbC1wb25kLSR7dGltZXN0YW1wfWAsCgogICAgICBkZWZhdWx0Q29uZmlnOiB7CiAgICAgICAgLyoqCiAgICAgICAgICogQGRlc2NyaXB0aW9uIERhdGEKICAgICAgICAgKiBAdHlwZSB7QXJyYXk8TnVtYmVyPn0KICAgICAgICAgKiBAZGVmYXVsdCBkYXRhID0gW10KICAgICAgICAgKiBAZXhhbXBsZSBkYXRhID0gWzYwLCA0MF0KICAgICAgICAgKi8KICAgICAgICBkYXRhOiBbXSwKICAgICAgICAvKioKICAgICAgICAgKiBAZGVzY3JpcHRpb24gU2hhcGUgb2Ygd2FudGVyIGxldmVsIHBvbmQKICAgICAgICAgKiBAdHlwZSB7U3RyaW5nfQogICAgICAgICAqIEBkZWZhdWx0IHNoYXBlID0gJ3JlY3QnCiAgICAgICAgICogQGV4YW1wbGUgc2hhcGUgPSAncmVjdCcgfCAncm91bmRSZWN0JyB8ICdyb3VuZCcKICAgICAgICAgKi8KICAgICAgICBzaGFwZTogJ3JlY3QnLAogICAgICAgIC8qKgogICAgICAgICAqIEBkZXNjcmlwdGlvbiBXYXRlciB3YXZlIG51bWJlcgogICAgICAgICAqIEB0eXBlIHtOdW1iZXJ9CiAgICAgICAgICogQGRlZmF1bHQgd2F2ZU51bSA9IDMKICAgICAgICAgKi8KICAgICAgICB3YXZlTnVtOiAzLAogICAgICAgIC8qKgogICAgICAgICAqIEBkZXNjcmlwdGlvbiBXYXRlciB3YXZlIGhlaWdodCAocHgpCiAgICAgICAgICogQHR5cGUge051bWJlcn0KICAgICAgICAgKiBAZGVmYXVsdCB3YXZlSGVpZ2h0ID0gNDAKICAgICAgICAgKi8KICAgICAgICB3YXZlSGVpZ2h0OiA0MCwKICAgICAgICAvKioKICAgICAgICAgKiBAZGVzY3JpcHRpb24gV2F2ZSBvcGFjaXR5CiAgICAgICAgICogQHR5cGUge051bWJlcn0KICAgICAgICAgKiBAZGVmYXVsdCB3YXZlT3BhY2l0eSA9IDAuNAogICAgICAgICAqLwogICAgICAgIHdhdmVPcGFjaXR5OiAwLjQsCiAgICAgICAgLyoqCiAgICAgICAgICogQGRlc2NyaXB0aW9uIENvbG9ycyAoaGV4fHJnYnxyZ2JhfGNvbG9yIGtleXdvcmRzKQogICAgICAgICAqIEB0eXBlIHtBcnJheTxTdHJpbmc+fQogICAgICAgICAqIEBkZWZhdWx0IGNvbG9ycyA9IFsnIzAwQkFGRicsICcjM0RFN0M5J10KICAgICAgICAgKiBAZXhhbXBsZSBjb2xvcnMgPSBbJyMwMDAnLCAncmdiKDAsIDAsIDApJywgJ3JnYmEoMCwgMCwgMCwgMSknLCAncmVkJ10KICAgICAgICAgKi8KICAgICAgICBjb2xvcnM6IFsnIzNERTdDOScsICcjMDBCQUZGJ10sCiAgICAgICAgLyoqCiAgICAgICAgICogQGRlc2NyaXB0aW9uIEZvcm1hdHRlcgogICAgICAgICAqIEB0eXBlIHtTdHJpbmd9CiAgICAgICAgICogQGRlZmF1bHQgZm9ybWF0dGVyID0gJ3t2YWx1ZX0lJwogICAgICAgICAqLwogICAgICAgIGZvcm1hdHRlcjogJ3t2YWx1ZX0lJwogICAgICB9LAoKICAgICAgbWVyZ2VkQ29uZmlnOiB7fSwKCiAgICAgIHJlbmRlcmVyOiBudWxsLAoKICAgICAgc3ZnQm9yZGVyR3JhZGllbnQ6IFtdLAoKICAgICAgZGV0YWlsczogJycsCgogICAgICB3YXZlczogW10sCgogICAgICBhbmltYXRpb246IGZhbHNlCiAgICB9CiAgfSwKICBjb21wdXRlZDogewogICAgcmFkaXVzICgpIHsKICAgICAgY29uc3QgeyBzaGFwZSB9ID0gdGhpcy5tZXJnZWRDb25maWcKCiAgICAgIGlmIChzaGFwZSA9PT0gJ3JvdW5kJykgcmV0dXJuICc1MCUnCgogICAgICBpZiAoc2hhcGUgPT09ICdyZWN0JykgcmV0dXJuICcwJwoKICAgICAgaWYgKHNoYXBlID09PSAncm91bmRSZWN0JykgcmV0dXJuICcxMHB4JwoKICAgICAgcmV0dXJuICcwJwogICAgfSwKICAgIHNoYXBlICgpIHsKICAgICAgY29uc3QgeyBzaGFwZSB9ID0gdGhpcy5tZXJnZWRDb25maWcKCiAgICAgIGlmICghc2hhcGUpIHJldHVybiAncmVjdCcKCiAgICAgIHJldHVybiBzaGFwZQogICAgfQogIH0sCiAgd2F0Y2g6IHsKICAgIGNvbmZpZyAoKSB7CiAgICAgIGNvbnN0IHsgY2FsY0RhdGEsIHJlbmRlcmVyIH0gPSB0aGlzCgogICAgICByZW5kZXJlci5kZWxBbGxHcmFwaCgpCgogICAgICB0aGlzLndhdmVzID0gW10KCiAgICAgIHNldFRpbWVvdXQoY2FsY0RhdGEsIDApCiAgICB9CiAgfSwKICBtZXRob2RzOiB7CiAgICBpbml0ICgpIHsKICAgICAgY29uc3QgeyBpbml0UmVuZGVyLCBjb25maWcsIGNhbGNEYXRhIH0gPSB0aGlzCgogICAgICBpbml0UmVuZGVyKCkKCiAgICAgIGlmICghY29uZmlnKSByZXR1cm4KCiAgICAgIGNhbGNEYXRhKCkKICAgIH0sCiAgICBpbml0UmVuZGVyICgpIHsKICAgICAgY29uc3QgeyAkcmVmcyB9ID0gdGhpcwoKICAgICAgdGhpcy5yZW5kZXJlciA9IG5ldyBDUmVuZGVyKCRyZWZzWyd3YXRlci1wb25kLWxldmVsJ10pCiAgICB9LAogICAgY2FsY0RhdGEgKCkgewogICAgICBjb25zdCB7IG1lcmdlQ29uZmlnLCBjYWxjU3ZnQm9yZGVyR3JhZGllbnQsIGNhbGNEZXRhaWxzIH0gPSB0aGlzCgogICAgICBtZXJnZUNvbmZpZygpCgogICAgICBjYWxjU3ZnQm9yZGVyR3JhZGllbnQoKQoKICAgICAgY2FsY0RldGFpbHMoKQoKICAgICAgY29uc3QgeyBhZGRXYXZlLCBhbmltYXRpb25XYXZlIH0gPSB0aGlzCgogICAgICBhZGRXYXZlKCkKCiAgICAgIGFuaW1hdGlvbldhdmUoKQogICAgfSwKICAgIG1lcmdlQ29uZmlnICgpIHsKICAgICAgY29uc3QgeyBjb25maWcsIGRlZmF1bHRDb25maWcgfSA9IHRoaXMKCiAgICAgIHRoaXMubWVyZ2VkQ29uZmlnID0gZGVlcE1lcmdlKGRlZXBDbG9uZShkZWZhdWx0Q29uZmlnLCB0cnVlKSwgY29uZmlnKQogICAgfSwKICAgIGNhbGNTdmdCb3JkZXJHcmFkaWVudCAoKSB7CiAgICAgIGNvbnN0IHsgY29sb3JzIH0gPSB0aGlzLm1lcmdlZENvbmZpZwoKICAgICAgY29uc3QgY29sb3JOdW0gPSBjb2xvcnMubGVuZ3RoCgogICAgICBjb25zdCBjb2xvck9mZnNldEdhcCA9IDEwMCAvIChjb2xvck51bSAtIDEpCgogICAgICB0aGlzLnN2Z0JvcmRlckdyYWRpZW50ID0gY29sb3JzLm1hcCgoYywgaSkgPT4gW2NvbG9yT2Zmc2V0R2FwICogaSwgY10pCiAgICB9LAogICAgY2FsY0RldGFpbHMgKCkgewogICAgICBjb25zdCB7IGRhdGEsIGZvcm1hdHRlciB9ID0gdGhpcy5tZXJnZWRDb25maWcKCiAgICAgIGlmICghZGF0YS5sZW5ndGgpIHsKICAgICAgICB0aGlzLmRldGFpbHMgPSAnJwoKICAgICAgICByZXR1cm4KICAgICAgfQoKICAgICAgY29uc3QgbWF4VmFsdWUgPSBNYXRoLm1heCguLi5kYXRhKQoKICAgICAgdGhpcy5kZXRhaWxzID0gZm9ybWF0dGVyLnJlcGxhY2UoJ3t2YWx1ZX0nLCBtYXhWYWx1ZSkKICAgIH0sCiAgICBhZGRXYXZlICgpIHsKICAgICAgY29uc3QgeyByZW5kZXJlciwgZ2V0V2F2ZVNoYXBlcywgZ2V0V2F2ZVN0eWxlLCBkcmF3ZWQgfSA9IHRoaXMKCiAgICAgIGNvbnN0IHNoYXBlcyA9IGdldFdhdmVTaGFwZXMoKQogICAgICBjb25zdCBzdHlsZSA9IGdldFdhdmVTdHlsZSgpCgogICAgICB0aGlzLndhdmVzID0gc2hhcGVzLm1hcChzaGFwZSA9PiByZW5kZXJlci5hZGQoewogICAgICAgIG5hbWU6ICdzbW9vdGhsaW5lJywKICAgICAgICBhbmltYXRpb25GcmFtZTogMzAwLAogICAgICAgIHNoYXBlLAogICAgICAgIHN0eWxlLAogICAgICAgIGRyYXdlZAogICAgICB9KSkKICAgIH0sCiAgICBnZXRXYXZlU2hhcGVzICgpIHsKICAgICAgY29uc3QgeyBtZXJnZWRDb25maWcsIHJlbmRlcmVyLCBtZXJnZU9mZnNldCB9ID0gdGhpcwoKICAgICAgY29uc3QgeyB3YXZlTnVtLCB3YXZlSGVpZ2h0LCBkYXRhIH0gPSBtZXJnZWRDb25maWcKCiAgICAgIGNvbnN0IFt3LCBoXSA9IHJlbmRlcmVyLmFyZWEKCiAgICAgIGNvbnN0IHBvaW50c051bSA9IHdhdmVOdW0gKiA0ICsgNAoKICAgICAgY29uc3QgcG9pbnRYR2FwID0gdyAvIHdhdmVOdW0gLyAyCgogICAgICByZXR1cm4gZGF0YS5tYXAodiA9PiB7CiAgICAgICAgbGV0IHBvaW50cyA9IG5ldyBBcnJheShwb2ludHNOdW0pLmZpbGwoMCkubWFwKChmb28sIGopID0+IHsKICAgICAgICAgIGNvbnN0IHggPSB3IC0gcG9pbnRYR2FwICogagoKICAgICAgICAgIGNvbnN0IHN0YXJ0WSA9ICgxIC0gdiAvIDEwMCkgKiBoCgogICAgICAgICAgY29uc3QgeSA9IGogJSAyID09PSAwID8gc3RhcnRZIDogc3RhcnRZIC0gd2F2ZUhlaWdodAoKICAgICAgICAgIHJldHVybiBbeCwgeV0KICAgICAgICB9KQoKICAgICAgICBwb2ludHMgPSBwb2ludHMubWFwKHAgPT4gbWVyZ2VPZmZzZXQocCwgW3BvaW50WEdhcCAqIDIsIDBdKSkKCiAgICAgICAgcmV0dXJuIHsgcG9pbnRzIH0KICAgICAgfSkKICAgIH0sCiAgICBtZXJnZU9mZnNldCAoW3gsIHldLCBbb3gsIG95XSkgewogICAgICByZXR1cm4gW3ggKyBveCwgeSArIG95XQogICAgfSwKICAgIGdldFdhdmVTdHlsZSAoKSB7CiAgICAgIGNvbnN0IHsgcmVuZGVyZXIsIG1lcmdlZENvbmZpZyB9ID0gdGhpcwoKICAgICAgY29uc3QgaCA9IHJlbmRlcmVyLmFyZWFbMV0KCiAgICAgIHJldHVybiB7CiAgICAgICAgZ3JhZGllbnRDb2xvcjogbWVyZ2VkQ29uZmlnLmNvbG9ycywKICAgICAgICBncmFkaWVudFR5cGU6ICdsaW5lYXInLAogICAgICAgIGdyYWRpZW50UGFyYW1zOiBbMCwgMCwgMCwgaF0sCiAgICAgICAgZ3JhZGllbnRXaXRoOiAnZmlsbCcsCiAgICAgICAgb3BhY2l0eTogbWVyZ2VkQ29uZmlnLndhdmVPcGFjaXR5LAogICAgICAgIHRyYW5zbGF0ZTogWzAsIDBdCiAgICAgIH0KICAgIH0sCiAgICBkcmF3ZWQgKHsgc2hhcGU6IHsgcG9pbnRzIH0gfSwgeyBjdHgsIGFyZWEgfSkgewogICAgICBjb25zdCBmaXJzdFBvaW50ID0gcG9pbnRzWzBdCiAgICAgIGNvbnN0IGxhc3RQb2ludCA9IHBvaW50cy5zbGljZSgtMSlbMF0KCiAgICAgIGNvbnN0IGggPSBhcmVhWzFdCgogICAgICBjdHgubGluZVRvKGxhc3RQb2ludFswXSwgaCkKICAgICAgY3R4LmxpbmVUbyhmaXJzdFBvaW50WzBdLCBoKQoKICAgICAgY3R4LmNsb3NlUGF0aCgpCgogICAgICBjdHguZmlsbCgpCiAgICB9LAogICAgYXN5bmMgYW5pbWF0aW9uV2F2ZSAocmVwZWF0ID0gMSkgewogICAgICBjb25zdCB7IHdhdmVzLCByZW5kZXJlciwgYW5pbWF0aW9uIH0gPSB0aGlzCgogICAgICBpZiAoYW5pbWF0aW9uKSByZXR1cm4KCiAgICAgIHRoaXMuYW5pbWF0aW9uID0gdHJ1ZQoKICAgICAgY29uc3QgdyA9IHJlbmRlcmVyLmFyZWFbMF0KCiAgICAgIHdhdmVzLmZvckVhY2goZ3JhcGggPT4gewogICAgICAgIGdyYXBoLmF0dHIoJ3N0eWxlJywgeyB0cmFuc2xhdGU6IFswLCAwXSB9KQoKICAgICAgICBncmFwaC5hbmltYXRpb24oJ3N0eWxlJywgewogICAgICAgICAgdHJhbnNsYXRlOiBbdywgMF0KICAgICAgICB9LCB0cnVlKQogICAgICB9KQoKICAgICAgYXdhaXQgcmVuZGVyZXIubGF1bmNoQW5pbWF0aW9uKCkKCiAgICAgIHRoaXMuYW5pbWF0aW9uID0gZmFsc2UKCiAgICAgIGlmICghcmVuZGVyZXIuZ3JhcGhzLmxlbmd0aCkgcmV0dXJuCgogICAgICB0aGlzLmFuaW1hdGlvbldhdmUocmVwZWF0ICsgMSkKICAgIH0KICB9LAogIG1vdW50ZWQgKCkgewogICAgY29uc3QgeyBpbml0IH0gPSB0aGlzCgogICAgaW5pdCgpCiAgfSwKICBiZWZvcmVEZXN0cm95ICgpIHsKICAgIGNvbnN0IHsgcmVuZGVyZXIgfSA9IHRoaXMKCiAgICByZW5kZXJlci5kZWxBbGxHcmFwaCgpCgogICAgdGhpcy53YXZlcyA9IFtdCiAgfQp9Cg=="},{"version":3,"sources":["main.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0CA;;AAEA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;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;;AAEA;;AAEA;;AAEA;;AAEA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;;AAEA;;AAEA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;;AAEA;;AAEA;;AAEA;;AAEA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;;AAEA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;;AAEA;;AAEA;;AAEA;AACA;AACA;;AAEA;;AAEA;;AAEA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;;AAEA;;AAEA;;AAEA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;;AAEA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA","file":"main.vue","sourceRoot":"node_modules/@jiaminghi/data-view/lib/components/waterLevelPond/src","sourcesContent":["<template>\n <div class=\"dv-water-pond-level\">\n <svg v-if=\"renderer\">\n <defs>\n <linearGradient :id=\"gradientId\" x1=\"0%\" y1=\"0%\" x2=\"0%\" y2=\"100%\">\n <stop v-for=\"lc in svgBorderGradient\" :key=\"lc[0]\"\n :offset=\"lc[0]\"\n :stop-color=\"lc[1]\" />\n </linearGradient>\n </defs>\n\n <text\n v-if=\"renderer\"\n :stroke=\"`url(#${gradientId})`\"\n :fill=\"`url(#${gradientId})`\"\n :x=\"renderer.area[0] / 2 + 8\"\n :y=\"renderer.area[1] / 2 + 8\"\n >\n {{ details }}\n </text>\n\n <ellipse v-if=\"!shape || shape === 'round'\"\n :cx=\"renderer.area[0] / 2 + 8\"\n :cy=\"renderer.area[1] / 2 + 8\"\n :rx=\"renderer.area[0] / 2 + 5\"\n :ry=\"renderer.area[1] / 2 + 5\"\n :stroke=\"`url(#${gradientId})`\" />\n\n <rect v-else\n x=\"2\" y=\"2\"\n :rx=\"shape === 'roundRect' ? 10 : 0\"\n :ry=\"shape === 'roundRect' ? 10 : 0\"\n :width=\"renderer.area[0] + 12\"\n :height=\"renderer.area[1] + 12\"\n :stroke=\"`url(#${gradientId})`\" />\n </svg>\n\n <canvas ref=\"water-pond-level\" :style=\"`border-radius: ${radius};`\" />\n </div>\n</template>\n\n<script>\nimport { deepMerge } from '@jiaminghi/charts/lib/util/index'\n\nimport { deepClone } from '@jiaminghi/c-render/lib/plugin/util'\n\nimport CRender from '@jiaminghi/c-render'\n\nexport default {\n name: 'DvWaterLevelPond',\n props: {\n config: Object,\n default: () => ({})\n },\n data () {\n const timestamp = Date.now()\n return {\n gradientId: `water-level-pond-${timestamp}`,\n\n defaultConfig: {\n /**\n * @description Data\n * @type {Array<Number>}\n * @default data = []\n * @example data = [60, 40]\n */\n data: [],\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 * @description Water wave number\n * @type {Number}\n * @default waveNum = 3\n */\n waveNum: 3,\n /**\n * @description Water wave height (px)\n * @type {Number}\n * @default waveHeight = 40\n */\n waveHeight: 40,\n /**\n * @description Wave opacity\n * @type {Number}\n * @default waveOpacity = 0.4\n */\n waveOpacity: 0.4,\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 * @description Formatter\n * @type {String}\n * @default formatter = '{value}%'\n */\n formatter: '{value}%'\n },\n\n mergedConfig: {},\n\n renderer: null,\n\n svgBorderGradient: [],\n\n details: '',\n\n waves: [],\n\n animation: false\n }\n },\n computed: {\n radius () {\n const { shape } = this.mergedConfig\n\n if (shape === 'round') return '50%'\n\n if (shape === 'rect') return '0'\n\n if (shape === 'roundRect') return '10px'\n\n return '0'\n },\n shape () {\n const { shape } = this.mergedConfig\n\n if (!shape) return 'rect'\n\n return shape\n }\n },\n watch: {\n config () {\n const { calcData, renderer } = this\n\n renderer.delAllGraph()\n\n this.waves = []\n\n setTimeout(calcData, 0)\n }\n },\n methods: {\n init () {\n const { initRender, config, calcData } = this\n\n initRender()\n\n if (!config) return\n\n calcData()\n },\n initRender () {\n const { $refs } = this\n\n this.renderer = new CRender($refs['water-pond-level'])\n },\n calcData () {\n const { mergeConfig, calcSvgBorderGradient, calcDetails } = this\n\n mergeConfig()\n\n calcSvgBorderGradient()\n\n calcDetails()\n\n const { addWave, animationWave } = this\n\n addWave()\n\n animationWave()\n },\n mergeConfig () {\n const { config, defaultConfig } = this\n\n this.mergedConfig = deepMerge(deepClone(defaultConfig, true), config)\n },\n calcSvgBorderGradient () {\n const { colors } = this.mergedConfig\n\n const colorNum = colors.length\n\n const colorOffsetGap = 100 / (colorNum - 1)\n\n this.svgBorderGradient = colors.map((c, i) => [colorOffsetGap * i, c])\n },\n calcDetails () {\n const { data, formatter } = this.mergedConfig\n\n if (!data.length) {\n this.details = ''\n\n return\n }\n\n const maxValue = Math.max(...data)\n\n this.details = formatter.replace('{value}', maxValue)\n },\n addWave () {\n const { renderer, getWaveShapes, getWaveStyle, drawed } = this\n\n const shapes = getWaveShapes()\n const style = getWaveStyle()\n\n this.waves = shapes.map(shape => renderer.add({\n name: 'smoothline',\n animationFrame: 300,\n shape,\n style,\n drawed\n }))\n },\n getWaveShapes () {\n const { mergedConfig, renderer, mergeOffset } = this\n\n const { waveNum, waveHeight, data } = mergedConfig\n\n const [w, h] = renderer.area\n\n const pointsNum = waveNum * 4 + 4\n\n const pointXGap = w / waveNum / 2\n\n return data.map(v => {\n let points = new Array(pointsNum).fill(0).map((foo, j) => {\n const x = w - pointXGap * j\n\n const startY = (1 - v / 100) * h\n\n const y = j % 2 === 0 ? startY : startY - waveHeight\n\n return [x, y]\n })\n\n points = points.map(p => mergeOffset(p, [pointXGap * 2, 0]))\n\n return { points }\n })\n },\n mergeOffset ([x, y], [ox, oy]) {\n return [x + ox, y + oy]\n },\n getWaveStyle () {\n const { renderer, mergedConfig } = this\n\n const h = renderer.area[1]\n\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 ({ shape: { points } }, { ctx, area }) {\n const firstPoint = points[0]\n const lastPoint = points.slice(-1)[0]\n\n const h = area[1]\n\n ctx.lineTo(lastPoint[0], h)\n ctx.lineTo(firstPoint[0], h)\n\n ctx.closePath()\n\n ctx.fill()\n },\n async animationWave (repeat = 1) {\n const { waves, renderer, animation } = this\n\n if (animation) return\n\n this.animation = true\n\n const w = renderer.area[0]\n\n waves.forEach(graph => {\n graph.attr('style', { translate: [0, 0] })\n\n graph.animation('style', {\n translate: [w, 0]\n }, true)\n })\n\n await renderer.launchAnimation()\n\n this.animation = false\n\n if (!renderer.graphs.length) return\n\n this.animationWave(repeat + 1)\n }\n },\n mounted () {\n const { init } = this\n\n init()\n },\n beforeDestroy () {\n const { renderer } = this\n\n renderer.delAllGraph()\n\n this.waves = []\n }\n}\n</script>"]}]} |