sean/manja_ui_dev
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

feat: add charts

Browse Source
This commit is contained in:
Marcin Michałek
2021-08-12 17:25:46 +02:00
parent baf340a65f
commit b61206112f
18 changed files with 1591 additions and 198 deletions
Download Patch File Download Diff File Expand all files Collapse all files
package-lock.json
Generated
+278 -189
View File
@@ -11,7 +11,9 @@
"@coreui/coreui": "^4.0.1",
"@coreui/icons": "^2.0.1",
"@coreui/icons-vue": "2.0.0-alpha.0",
"@coreui/vue": "^4.0.0-alpha.0",
"@coreui/utils": "^1.3.1",
"@coreui/vue": "^4.0.0-alpha.2",
"@coreui/vue-chartjs": "2.0.0-alpha.0",
"core-js": "^3.6.5",
"vue": "^3.0.0",
"vue-router": "^4.0.0-0",
@@ -419,14 +421,14 @@
}
},
"node_modules/@babel/helpers": {
"version": "7.14.8",
"resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.14.8.tgz",
"integrity": "sha512-ZRDmI56pnV+p1dH6d+UN6GINGz7Krps3+270qqI9UJ4wxYThfAIcI5i7j5vXC4FJ3Wap+S9qcebxeYiqn87DZw==",
"version": "7.15.3",
"resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.15.3.tgz",
"integrity": "sha512-HwJiz52XaS96lX+28Tnbu31VeFSQJGOeKHJeaEPQlTl7PnlhFElWPj8tUXtqFIzeN86XxXoBr+WFAyK2PPVz6g==",
"dev": true,
"dependencies": {
"@babel/template": "^7.14.5",
"@babel/traverse": "^7.14.8",
"@babel/types": "^7.14.8"
"@babel/traverse": "^7.15.0",
"@babel/types": "^7.15.0"
},
"engines": {
"node": ">=6.9.0"
@@ -447,9 +449,9 @@
}
},
"node_modules/@babel/parser": {
"version": "7.15.2",
"resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.15.2.tgz",
"integrity": "sha512-bMJXql1Ss8lFnvr11TZDH4ArtwlAS5NG9qBmdiFW2UHHm6MVoR+GDc5XE2b9K938cyjc9O6/+vjjcffLDtfuDg==",
"version": "7.15.3",
"resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.15.3.tgz",
"integrity": "sha512-O0L6v/HvqbdJawj0iBEfVQMc3/6WP+AeOsovsIgBFyJaG+W2w7eqvZB7puddATmWuARlm1SX7DwxJ/JJUnDpEA==",
"bin": {
"parser": "bin/babel-parser.js"
},
@@ -1020,9 +1022,9 @@
}
},
"node_modules/@babel/plugin-transform-block-scoping": {
"version": "7.14.5",
"resolved": "https://registry.npmjs.org/@babel/plugin-transform-block-scoping/-/plugin-transform-block-scoping-7.14.5.tgz",
"integrity": "sha512-LBYm4ZocNgoCqyxMLoOnwpsmQ18HWTQvql64t3GvMUzLQrNoV1BDG0lNftC8QKYERkZgCCT/7J5xWGObGAyHDw==",
"version": "7.15.3",
"resolved": "https://registry.npmjs.org/@babel/plugin-transform-block-scoping/-/plugin-transform-block-scoping-7.15.3.tgz",
"integrity": "sha512-nBAzfZwZb4DkaGtOes1Up1nOAp9TDRRFw4XBzBBSG9QK7KVFmYzgj9o9sbPv7TX5ofL4Auq4wZnxCoPnI/lz2Q==",
"dev": true,
"dependencies": {
"@babel/helper-plugin-utils": "^7.14.5"
@@ -1600,9 +1602,9 @@
}
},
"node_modules/@babel/runtime": {
"version": "7.14.8",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.14.8.tgz",
"integrity": "sha512-twj3L8Og5SaCRCErB4x4ajbvBIVV77CGeFglHpeg5WC5FF8TZzBWXtTJ4MqaD9QszLYTtr+IsaAL2rEUevb+eg==",
"version": "7.15.3",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.15.3.tgz",
"integrity": "sha512-OvwMLqNXkCXSz1kSm58sEsNuhqOx/fKpnUnKnFB5v8uDda5bLNEHNgKPvhDN6IU0LDcnHQ90LlJ0Q6jnyBSIBA==",
"dev": true,
"dependencies": {
"regenerator-runtime": "^0.13.4"
@@ -1673,6 +1675,23 @@
"node": ">=0.1.95"
}
},
"node_modules/@coreui/chartjs": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/@coreui/chartjs/-/chartjs-3.0.0.tgz",
"integrity": "sha512-udbvSxanTNltv94lqTMW8bLRXTtzk9G2SrmFdM/7HH+JSaLX2wdQpZ4VIJhyOCRGLCSKHktl29BnW1/uXQecAg==",
"dependencies": {
"@coreui/coreui": "4.0.0",
"chart.js": "^3.4.0"
}
},
"node_modules/@coreui/chartjs/node_modules/@coreui/coreui": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/@coreui/coreui/-/coreui-4.0.0.tgz",
"integrity": "sha512-8vH6fJrmvCR/Oy5v0E+/1AL3Ygb4jhQ7NXK2fMYWJyK13BePDm9muB3y6S0IdqkpBwjY3hHVwHyt2lJqJdesmQ==",
"peerDependencies": {
"@popperjs/core": "^2.9.2"
}
},
"node_modules/@coreui/coreui": {
"version": "4.0.1",
"resolved": "https://registry.npmjs.org/@coreui/coreui/-/coreui-4.0.1.tgz",
@@ -1694,10 +1713,19 @@
"vue": "^3.0.10"
}
},
"node_modules/@coreui/utils": {
"version": "1.3.1",
"resolved": "https://registry.npmjs.org/@coreui/utils/-/utils-1.3.1.tgz",
"integrity": "sha512-WuWHX7bg89cJH34TWVsLe9RsxzBhTApj+X2Ja19xhjcpxt5Gv11Ozm+fwYt6DD7DgncTvpwYrMcnNlpp701UOg==",
"engines": {
"node": ">=8.9.0",
"npm": ">= 5.6.0"
}
},
"node_modules/@coreui/vue": {
"version": "4.0.0-alpha.1",
"resolved": "https://registry.npmjs.org/@coreui/vue/-/vue-4.0.0-alpha.1.tgz",
"integrity": "sha512-7LjbYEKwnN1x2vQvwkHyypP+7LUhHHJCmw2U6ILljVhb/ONY/+7+9dM1AbejMsbeZ3IIAzUe56Uta+lfGveQow==",
"version": "4.0.0-alpha.2",
"resolved": "https://registry.npmjs.org/@coreui/vue/-/vue-4.0.0-alpha.2.tgz",
"integrity": "sha512-h/mrYa4gEHtnMbZyyfjyBuN160T4vjTJLSDKcGNu+wjCzVsZN/vSNbOP9QRk428ySfIFB+tmzSImSrHMx0O0kw==",
"dependencies": {
"@coreui/coreui": "^4.0.1",
"@coreui/icons": "^2.0.1",
@@ -1710,10 +1738,23 @@
"vue": "^3.0.5"
}
},
"node_modules/@coreui/vue-chartjs": {
"version": "2.0.0-alpha.0",
"resolved": "https://registry.npmjs.org/@coreui/vue-chartjs/-/vue-chartjs-2.0.0-alpha.0.tgz",
"integrity": "sha512-A9Z5uooElEyQPyn+GX0/my9OUMxtf8K5S+75ONTVc/m02YWE93UHZl1cEtbo+ooqyNiKHkGGL+iYGFUnpHQLrQ==",
"dependencies": {
"@coreui/chartjs": "^3.0.0",
"chart.js": "^3.4.1",
"vue": "^3.0.10"
},
"peerDependencies": {
"vue": "^3.0.10"
}
},
"node_modules/@coreui/vue/node_modules/@coreui/icons-vue": {
"version": "2.0.0-alpha.1",
"resolved": "https://registry.npmjs.org/@coreui/icons-vue/-/icons-vue-2.0.0-alpha.1.tgz",
"integrity": "sha512-jhs21oLa7t4oqHjldnJeEmLTt9kVbZrbSbPV0/2z7MIUl9vTlmWZDX8jg9vCErs/4BTb/xPCG/vDJ8jGoEvccw==",
"version": "2.0.0-alpha.2",
"resolved": "https://registry.npmjs.org/@coreui/icons-vue/-/icons-vue-2.0.0-alpha.2.tgz",
"integrity": "sha512-r4WfLSqJasFAqTHPluq1An/dRj6+FKtiPfCugmVKZNiVVk4lxk2qMZffZb5tb148vYlK+QMKnXnVZfBdCveaFA==",
"dependencies": {
"vue": "^3.0.10"
},
@@ -4190,9 +4231,9 @@
"dev": true
},
"node_modules/@types/node": {
"version": "16.4.13",
"resolved": "https://registry.npmjs.org/@types/node/-/node-16.4.13.tgz",
"integrity": "sha512-bLL69sKtd25w7p1nvg9pigE4gtKVpGTPojBFLMkGHXuUgap2sLqQt2qUnqmVCDfzGUL0DRNZP+1prIZJbMeAXg==",
"version": "16.6.0",
"resolved": "https://registry.npmjs.org/@types/node/-/node-16.6.0.tgz",
"integrity": "sha512-OyiZPohMMjZEYqcVo/UJ04GyAxXOJEZO/FpzyXxcH4r/ArrVoXHf4MbUrkLp0Tz7/p1mMKpo5zJ6ZHl8XBNthQ==",
"dev": true
},
"node_modules/@types/normalize-package-data": {
@@ -6042,13 +6083,13 @@
}
},
"node_modules/@vue/compiler-core": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.2.1.tgz",
"integrity": "sha512-UEJf2ZGww5wGVdrWIXIZo04KdJFGPmI2bHRUsBZ3AdyCAqJ5ykRXKOBn1OR1hvA2YzimudOEyHM+DpbBv91Kww==",
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.2.2.tgz",
"integrity": "sha512-QhCI0ZU5nAR0LMcLgzW3v75374tIrHGp8XG5CzJS7Nsy+iuignbE4MZ2XJfh5TGIrtpuzfWA4eTIfukZf/cRdg==",
"dependencies": {
"@babel/parser": "^7.12.0",
"@babel/types": "^7.12.0",
"@vue/shared": "3.2.1",
"@vue/shared": "3.2.2",
"estree-walker": "^2.0.1",
"source-map": "^0.6.1"
}
@@ -6062,27 +6103,27 @@
}
},
"node_modules/@vue/compiler-dom": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.2.1.tgz",
"integrity": "sha512-tXg8tkPb3j54zNfWqoao9T1JI41yWPz8TROzmif/QNNA46eq8/SRuRsBd36i47GWaz7mh+yg3vOJ87/YBjcMyQ==",
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.2.2.tgz",
"integrity": "sha512-ggcc+NV/ENIE0Uc3TxVE/sKrhYVpLepMAAmEiQ047332mbKOvUkowz4TTFZ+YkgOIuBOPP0XpCxmCMg7p874mA==",
"dependencies": {
"@vue/compiler-core": "3.2.1",
"@vue/shared": "3.2.1"
"@vue/compiler-core": "3.2.2",
"@vue/shared": "3.2.2"
}
},
"node_modules/@vue/compiler-sfc": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.2.1.tgz",
"integrity": "sha512-fVLdme5RZVkBt+jxv2LCSRM72o4FX7BR2eu2FpjjEi1kEtUMKBDnjKwGWy7TyhTju0t0CocctyoM+G56vH7NpQ==",
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.2.2.tgz",
"integrity": "sha512-hrtqpQ5L6IPn5v7yVRo7uvLcQxv0z1+KBjZBWMBOcrXz4t+PKUxU/SWd6Tl9T8FDmYlunzKUh6lcx+2CLo6f5A==",
"dev": true,
"dependencies": {
"@babel/parser": "^7.13.9",
"@babel/types": "^7.13.0",
"@types/estree": "^0.0.48",
"@vue/compiler-core": "3.2.1",
"@vue/compiler-dom": "3.2.1",
"@vue/compiler-ssr": "3.2.1",
"@vue/shared": "3.2.1",
"@vue/compiler-core": "3.2.2",
"@vue/compiler-dom": "3.2.2",
"@vue/compiler-ssr": "3.2.2",
"@vue/shared": "3.2.2",
"consolidate": "^0.16.0",
"estree-walker": "^2.0.1",
"hash-sum": "^2.0.0",
@@ -6213,12 +6254,12 @@
}
},
"node_modules/@vue/compiler-ssr": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.2.1.tgz",
"integrity": "sha512-6YAOtQunuEyYlVSjK1F7a7BXi7rxVfiTiJ0Ro7eq0q0MNCFV9Z+sN68lfa/E4ABVb0ledEY/Rt8kL23nwCoTCQ==",
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.2.2.tgz",
"integrity": "sha512-rVl1agMFhdEN3Go0bCriXo+3cysxKIuRP0yh1Wd8ysRrKfAmokyDhUA8PrGSq2Ymj/LdZTh+4OKfj3p2+C+hlA==",
"dependencies": {
"@vue/compiler-dom": "3.2.1",
"@vue/shared": "3.2.1"
"@vue/compiler-dom": "3.2.2",
"@vue/shared": "3.2.2"
}
},
"node_modules/@vue/component-compiler-utils": {
@@ -6329,48 +6370,48 @@
}
},
"node_modules/@vue/reactivity": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.2.1.tgz",
"integrity": "sha512-4Lja2KmyiKvuraDed6dXK2A6+r/7x7xGDA7vVR2Aqc8hQVu0+FWeVX+IBfiVOSpbZXFlHLNmCBFkbuWLQSlgxg==",
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.2.2.tgz",
"integrity": "sha512-IHjhtmrhK6dzacj/EnLQDWOaA3HuzzVk6w84qgV8EpS4uWGIJXiRalMRg6XvGW2ykJvIl3pLsF0aBFlTMRiLOA==",
"dependencies": {
"@vue/shared": "3.2.1"
"@vue/shared": "3.2.2"
}
},
"node_modules/@vue/runtime-core": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.2.1.tgz",
"integrity": "sha512-IsgelRM/5hYeRhz5+ECi66XvYDdjG2t4lARjHvCXw5s9Q4N6uIbjLMwtLzAWRxYf3/y258BrD+ehxAi943ScJg==",
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.2.2.tgz",
"integrity": "sha512-/aUk1+GO/VPX0oVxhbzSWE1zrf3/wGCsO1ALNisVokYftKqfqLDjbJHE6mrI2hx3MiuwbHrWjJClkGUVTIOPEQ==",
"dependencies": {
"@vue/reactivity": "3.2.1",
"@vue/shared": "3.2.1"
"@vue/reactivity": "3.2.2",
"@vue/shared": "3.2.2"
}
},
"node_modules/@vue/runtime-dom": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.2.1.tgz",
"integrity": "sha512-bUAHUSe49A5wYdHQ8wsLU1CMPXaG2fRuv2661mx/6Q9+20QxglT3ss8ZeL6AVRu16JNJMcdvTTsNpbnMbVc/lQ==",
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.2.2.tgz",
"integrity": "sha512-1Le/NpCfawCOfePfJezvWUF+oCVLU8N+IHN4oFDOxRe6/PgHNJ+yT+YdxFifBfI+TIAoXI/9PsnqzmJZV+xsmw==",
"dependencies": {
"@vue/runtime-core": "3.2.1",
"@vue/shared": "3.2.1",
"@vue/runtime-core": "3.2.2",
"@vue/shared": "3.2.2",
"csstype": "^2.6.8"
}
},
"node_modules/@vue/server-renderer": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.2.1.tgz",
"integrity": "sha512-Zphh7jjysefw4c4mqy2gDlg5W1MYpYuXPlbv2qnjr4IQHjR/FXQfrqo7U858SOCGXL7sXvx025/BstefP4WBTg==",
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.2.2.tgz",
"integrity": "sha512-o2EcPOeDfXvSK85OhdUWVUYumFW57+MwGFCszOqka2EFpOQVrzvUtYeF6KN2kCuAxexnuVQYtIDQwPZRchXSnQ==",
"dependencies": {
"@vue/compiler-ssr": "3.2.1",
"@vue/shared": "3.2.1"
"@vue/compiler-ssr": "3.2.2",
"@vue/shared": "3.2.2"
},
"peerDependencies": {
"vue": "3.2.1"
"vue": "3.2.2"
}
},
"node_modules/@vue/shared": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.2.1.tgz",
"integrity": "sha512-INN92dVBNgd0TW9BqfQQKx/HWGCHhUUbAV5EZ5FgSCiEdwuZsJbGt1mdnaD9IxGhpiyOjP2ClxGG8SFp7ELcWg=="
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.2.2.tgz",
"integrity": "sha512-dvYb318tk9uOzHtSaT3WII/HscQSIRzoCZ5GyxEb3JlkEXASpAUAQwKnvSe2CudnF8XHFRTB7VITWSnWNLZUtA=="
},
"node_modules/@vue/test-utils": {
"version": "2.0.0-rc.12",
@@ -8273,9 +8314,9 @@
}
},
"node_modules/caniuse-lite": {
"version": "1.0.30001249",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001249.tgz",
"integrity": "sha512-vcX4U8lwVXPdqzPWi6cAJ3FnQaqXbBqy/GZseKNQzRj37J7qZdGcBtxq/QLFNLLlfsoXLUdHw8Iwenri86Tagw==",
"version": "1.0.30001251",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001251.tgz",
"integrity": "sha512-HOe1r+9VkU4TFmnU70z+r7OLmtR+/chB1rdcJUeQlAinjEeb0cKL20tlAtOagNZhbrtLnCvV19B4FmF1rgzl6A==",
"dev": true,
"funding": {
"type": "opencollective",
@@ -8360,6 +8401,11 @@
"integrity": "sha512-mT8iDcrh03qDGRRmoA2hmBJnxpllMR+0/0qlzjqZES6NdiWDcZkCNAk4rPFZ9Q85r27unkiNNg8ZOiwZXBHwcA==",
"dev": true
},
"node_modules/chart.js": {
"version": "3.5.0",
"resolved": "https://registry.npmjs.org/chart.js/-/chart.js-3.5.0.tgz",
"integrity": "sha512-J1a4EAb1Gi/KbhwDRmoovHTRuqT8qdF0kZ4XgwxpGethJHUdDrkqyPYwke0a+BuvSeUxPf8Cos6AX2AB8H8GLA=="
},
"node_modules/check-types": {
"version": "8.0.3",
"resolved": "https://registry.npmjs.org/check-types/-/check-types-8.0.3.tgz",
@@ -8923,9 +8969,9 @@
}
},
"node_modules/colorette": {
"version": "1.2.2",
"resolved": "https://registry.npmjs.org/colorette/-/colorette-1.2.2.tgz",
"integrity": "sha512-MKGMzyfeuutC/ZJ1cba9NqcNpfeqMUcYmyF1ZFY6/Cn7CNSAKx6a+s48sqLqyAiZuaP2TcqMhoo+dlwFnVxT9w==",
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/colorette/-/colorette-1.3.0.tgz",
"integrity": "sha512-ecORCqbSFP7Wm8Y6lyqMJjexBQqXSF7SSeaTyGGphogUjBlFP9m9o08wy86HL2uB7fMTxtOUzLMk7ogKcxMg1w==",
"dev": true
},
"node_modules/combined-stream": {
@@ -10602,9 +10648,9 @@
}
},
"node_modules/electron-to-chromium": {
"version": "1.3.801",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.801.tgz",
"integrity": "sha512-xapG8ekC+IAHtJrGBMQSImNuN+dm+zl7UP1YbhvTkwQn8zf/yYuoxfTSAEiJ9VDD+kjvXaAhNDPSxJ+VImtAJA==",
"version": "1.3.803",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.803.tgz",
"integrity": "sha512-tmRK9qB8Zs8eLMtTBp+w2zVS9MUe62gQQQHjYdAc5Zljam3ZIokNb+vZLPRz9RCREp6EFRwyhOFwbt1fEriQ2Q==",
"dev": true
},
"node_modules/elegant-spinner": {
@@ -13595,10 +13641,13 @@
"dev": true
},
"node_modules/is-bigint": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/is-bigint/-/is-bigint-1.0.3.tgz",
"integrity": "sha512-ZU538ajmYJmzysE5yU4Y7uIrPQ2j704u+hXFiIPQExpqzzUbpe5jCPdTfmz7jXRxZdvjY3KZ3ZNenoXQovX+Dg==",
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/is-bigint/-/is-bigint-1.0.4.tgz",
"integrity": "sha512-zB9CruMamjym81i2JZ3UMn54PKGsQzsJeo6xvN3HJJ4CAsQNB6iRutp2To77OfCNuoxspsIhzaPoO1zyCEhFOg==",
"dev": true,
"dependencies": {
"has-bigints": "^1.0.1"
},
"funding": {
"url": "https://github.com/sponsors/ljharb"
}
@@ -19398,9 +19447,9 @@
"optional": true
},
"node_modules/nanoid": {
"version": "3.1.23",
"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.23.tgz",
"integrity": "sha512-FiB0kzdP0FFVGDKlRLEQ1BgDzU87dy5NnzjeW9YZNt+/c3+q82EQDUwniSAUxp/F0gFNI1ZhKU1FqYsMuqZVnw==",
"version": "3.1.25",
"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.25.tgz",
"integrity": "sha512-rdwtIXaXCLFAQbnfqDRnI6jaRHp9fTcYBjtFKE8eezcZ7LuLjhUaQGNeMXf1HmRoCH32CLz6XwX0TtxEOS/A3Q==",
"dev": true,
"bin": {
"nanoid": "bin/nanoid.cjs"
@@ -19829,9 +19878,9 @@
}
},
"node_modules/node-releases": {
"version": "1.1.73",
"resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.73.tgz",
"integrity": "sha512-uW7fodD6pyW2FZNZnp/Z3hvWKeEW1Y8R1+1CnErE8cXFXzl5blBOoVB41CvMer6P6Q0S5FXDwcHgFd1Wj0U9zg==",
"version": "1.1.74",
"resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.74.tgz",
"integrity": "sha512-caJBVempXZPepZoZAPCWRTNxYQ+xtG/KAi4ozTA5A+nJ7IU+kLQCbqaUjb5Rwy14M9upBWiQ4NutcmW04LJSRw==",
"dev": true
},
"node_modules/node-status-codes": {
@@ -24878,9 +24927,9 @@
}
},
"node_modules/tslib": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.0.tgz",
"integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==",
"version": "2.3.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.1.tgz",
"integrity": "sha512-77EbyPPpMz+FRFRuAFlWMtmgUWGe9UOG2Z25NqCwiIjRhOf5iKGuzSe5P2w1laq+FkRy4p+PCuVkJSGkzTEKVw==",
"dev": true
},
"node_modules/tsutils": {
@@ -25429,13 +25478,13 @@
"dev": true
},
"node_modules/vue": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/vue/-/vue-3.2.1.tgz",
"integrity": "sha512-0jhXluF5mzTAK5bXw/8yq4McvsI8HwEWI4cnQwJeN8NYGRbwh9wwuE4FNv1Kej9pxBB5ajTNsWr0M6DPs5EJZg==",
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/vue/-/vue-3.2.2.tgz",
"integrity": "sha512-D/LuzAV30CgNJYGyNheE/VUs5N4toL2IgmS6c9qeOxvyh0xyn4exyRqizpXIrsvfx34zG9x5gCI2tdRHCGvF9w==",
"dependencies": {
"@vue/compiler-dom": "3.2.1",
"@vue/runtime-dom": "3.2.1",
"@vue/shared": "3.2.1"
"@vue/compiler-dom": "3.2.2",
"@vue/runtime-dom": "3.2.2",
"@vue/shared": "3.2.2"
}
},
"node_modules/vue-eslint-parser": {
@@ -27927,14 +27976,14 @@
}
},
"@babel/helpers": {
"version": "7.14.8",
"resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.14.8.tgz",
"integrity": "sha512-ZRDmI56pnV+p1dH6d+UN6GINGz7Krps3+270qqI9UJ4wxYThfAIcI5i7j5vXC4FJ3Wap+S9qcebxeYiqn87DZw==",
"version": "7.15.3",
"resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.15.3.tgz",
"integrity": "sha512-HwJiz52XaS96lX+28Tnbu31VeFSQJGOeKHJeaEPQlTl7PnlhFElWPj8tUXtqFIzeN86XxXoBr+WFAyK2PPVz6g==",
"dev": true,
"requires": {
"@babel/template": "^7.14.5",
"@babel/traverse": "^7.14.8",
"@babel/types": "^7.14.8"
"@babel/traverse": "^7.15.0",
"@babel/types": "^7.15.0"
}
},
"@babel/highlight": {
@@ -27949,9 +27998,9 @@
}
},
"@babel/parser": {
"version": "7.15.2",
"resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.15.2.tgz",
"integrity": "sha512-bMJXql1Ss8lFnvr11TZDH4ArtwlAS5NG9qBmdiFW2UHHm6MVoR+GDc5XE2b9K938cyjc9O6/+vjjcffLDtfuDg=="
"version": "7.15.3",
"resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.15.3.tgz",
"integrity": "sha512-O0L6v/HvqbdJawj0iBEfVQMc3/6WP+AeOsovsIgBFyJaG+W2w7eqvZB7puddATmWuARlm1SX7DwxJ/JJUnDpEA=="
},
"@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining": {
"version": "7.14.5",
@@ -28327,9 +28376,9 @@
}
},
"@babel/plugin-transform-block-scoping": {
"version": "7.14.5",
"resolved": "https://registry.npmjs.org/@babel/plugin-transform-block-scoping/-/plugin-transform-block-scoping-7.14.5.tgz",
"integrity": "sha512-LBYm4ZocNgoCqyxMLoOnwpsmQ18HWTQvql64t3GvMUzLQrNoV1BDG0lNftC8QKYERkZgCCT/7J5xWGObGAyHDw==",
"version": "7.15.3",
"resolved": "https://registry.npmjs.org/@babel/plugin-transform-block-scoping/-/plugin-transform-block-scoping-7.15.3.tgz",
"integrity": "sha512-nBAzfZwZb4DkaGtOes1Up1nOAp9TDRRFw4XBzBBSG9QK7KVFmYzgj9o9sbPv7TX5ofL4Auq4wZnxCoPnI/lz2Q==",
"dev": true,
"requires": {
"@babel/helper-plugin-utils": "^7.14.5"
@@ -28718,9 +28767,9 @@
}
},
"@babel/runtime": {
"version": "7.14.8",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.14.8.tgz",
"integrity": "sha512-twj3L8Og5SaCRCErB4x4ajbvBIVV77CGeFglHpeg5WC5FF8TZzBWXtTJ4MqaD9QszLYTtr+IsaAL2rEUevb+eg==",
"version": "7.15.3",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.15.3.tgz",
"integrity": "sha512-OvwMLqNXkCXSz1kSm58sEsNuhqOx/fKpnUnKnFB5v8uDda5bLNEHNgKPvhDN6IU0LDcnHQ90LlJ0Q6jnyBSIBA==",
"dev": true,
"requires": {
"regenerator-runtime": "^0.13.4"
@@ -28773,6 +28822,23 @@
"minimist": "^1.2.0"
}
},
"@coreui/chartjs": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/@coreui/chartjs/-/chartjs-3.0.0.tgz",
"integrity": "sha512-udbvSxanTNltv94lqTMW8bLRXTtzk9G2SrmFdM/7HH+JSaLX2wdQpZ4VIJhyOCRGLCSKHktl29BnW1/uXQecAg==",
"requires": {
"@coreui/coreui": "4.0.0",
"chart.js": "^3.4.0"
},
"dependencies": {
"@coreui/coreui": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/@coreui/coreui/-/coreui-4.0.0.tgz",
"integrity": "sha512-8vH6fJrmvCR/Oy5v0E+/1AL3Ygb4jhQ7NXK2fMYWJyK13BePDm9muB3y6S0IdqkpBwjY3hHVwHyt2lJqJdesmQ==",
"requires": {}
}
}
},
"@coreui/coreui": {
"version": "4.0.1",
"resolved": "https://registry.npmjs.org/@coreui/coreui/-/coreui-4.0.1.tgz",
@@ -28790,10 +28856,15 @@
"integrity": "sha512-U2Wf4W/FeMsXjnTmi1MHenhOarycshkfwFeQHZtm07eQNB7pifryMpwjFX9MJcV1rmg4wvL9Ks1+hDDDJQdHjg==",
"requires": {}
},
"@coreui/utils": {
"version": "1.3.1",
"resolved": "https://registry.npmjs.org/@coreui/utils/-/utils-1.3.1.tgz",
"integrity": "sha512-WuWHX7bg89cJH34TWVsLe9RsxzBhTApj+X2Ja19xhjcpxt5Gv11Ozm+fwYt6DD7DgncTvpwYrMcnNlpp701UOg=="
},
"@coreui/vue": {
"version": "4.0.0-alpha.1",
"resolved": "https://registry.npmjs.org/@coreui/vue/-/vue-4.0.0-alpha.1.tgz",
"integrity": "sha512-7LjbYEKwnN1x2vQvwkHyypP+7LUhHHJCmw2U6ILljVhb/ONY/+7+9dM1AbejMsbeZ3IIAzUe56Uta+lfGveQow==",
"version": "4.0.0-alpha.2",
"resolved": "https://registry.npmjs.org/@coreui/vue/-/vue-4.0.0-alpha.2.tgz",
"integrity": "sha512-h/mrYa4gEHtnMbZyyfjyBuN160T4vjTJLSDKcGNu+wjCzVsZN/vSNbOP9QRk428ySfIFB+tmzSImSrHMx0O0kw==",
"requires": {
"@coreui/coreui": "^4.0.1",
"@coreui/icons": "^2.0.1",
@@ -28804,15 +28875,25 @@
},
"dependencies": {
"@coreui/icons-vue": {
"version": "2.0.0-alpha.1",
"resolved": "https://registry.npmjs.org/@coreui/icons-vue/-/icons-vue-2.0.0-alpha.1.tgz",
"integrity": "sha512-jhs21oLa7t4oqHjldnJeEmLTt9kVbZrbSbPV0/2z7MIUl9vTlmWZDX8jg9vCErs/4BTb/xPCG/vDJ8jGoEvccw==",
"version": "2.0.0-alpha.2",
"resolved": "https://registry.npmjs.org/@coreui/icons-vue/-/icons-vue-2.0.0-alpha.2.tgz",
"integrity": "sha512-r4WfLSqJasFAqTHPluq1An/dRj6+FKtiPfCugmVKZNiVVk4lxk2qMZffZb5tb148vYlK+QMKnXnVZfBdCveaFA==",
"requires": {
"vue": "^3.0.10"
}
}
}
},
"@coreui/vue-chartjs": {
"version": "2.0.0-alpha.0",
"resolved": "https://registry.npmjs.org/@coreui/vue-chartjs/-/vue-chartjs-2.0.0-alpha.0.tgz",
"integrity": "sha512-A9Z5uooElEyQPyn+GX0/my9OUMxtf8K5S+75ONTVc/m02YWE93UHZl1cEtbo+ooqyNiKHkGGL+iYGFUnpHQLrQ==",
"requires": {
"@coreui/chartjs": "^3.0.0",
"chart.js": "^3.4.1",
"vue": "^3.0.10"
}
},
"@hapi/address": {
"version": "2.1.4",
"resolved": "https://registry.npmjs.org/@hapi/address/-/address-2.1.4.tgz",
@@ -30840,9 +30921,9 @@
"dev": true
},
"@types/node": {
"version": "16.4.13",
"resolved": "https://registry.npmjs.org/@types/node/-/node-16.4.13.tgz",
"integrity": "sha512-bLL69sKtd25w7p1nvg9pigE4gtKVpGTPojBFLMkGHXuUgap2sLqQt2qUnqmVCDfzGUL0DRNZP+1prIZJbMeAXg==",
"version": "16.6.0",
"resolved": "https://registry.npmjs.org/@types/node/-/node-16.6.0.tgz",
"integrity": "sha512-OyiZPohMMjZEYqcVo/UJ04GyAxXOJEZO/FpzyXxcH4r/ArrVoXHf4MbUrkLp0Tz7/p1mMKpo5zJ6ZHl8XBNthQ==",
"dev": true
},
"@types/normalize-package-data": {
@@ -32300,13 +32381,13 @@
}
},
"@vue/compiler-core": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.2.1.tgz",
"integrity": "sha512-UEJf2ZGww5wGVdrWIXIZo04KdJFGPmI2bHRUsBZ3AdyCAqJ5ykRXKOBn1OR1hvA2YzimudOEyHM+DpbBv91Kww==",
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.2.2.tgz",
"integrity": "sha512-QhCI0ZU5nAR0LMcLgzW3v75374tIrHGp8XG5CzJS7Nsy+iuignbE4MZ2XJfh5TGIrtpuzfWA4eTIfukZf/cRdg==",
"requires": {
"@babel/parser": "^7.12.0",
"@babel/types": "^7.12.0",
"@vue/shared": "3.2.1",
"@vue/shared": "3.2.2",
"estree-walker": "^2.0.1",
"source-map": "^0.6.1"
},
@@ -32319,27 +32400,27 @@
}
},
"@vue/compiler-dom": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.2.1.tgz",
"integrity": "sha512-tXg8tkPb3j54zNfWqoao9T1JI41yWPz8TROzmif/QNNA46eq8/SRuRsBd36i47GWaz7mh+yg3vOJ87/YBjcMyQ==",
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.2.2.tgz",
"integrity": "sha512-ggcc+NV/ENIE0Uc3TxVE/sKrhYVpLepMAAmEiQ047332mbKOvUkowz4TTFZ+YkgOIuBOPP0XpCxmCMg7p874mA==",
"requires": {
"@vue/compiler-core": "3.2.1",
"@vue/shared": "3.2.1"
"@vue/compiler-core": "3.2.2",
"@vue/shared": "3.2.2"
}
},
"@vue/compiler-sfc": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.2.1.tgz",
"integrity": "sha512-fVLdme5RZVkBt+jxv2LCSRM72o4FX7BR2eu2FpjjEi1kEtUMKBDnjKwGWy7TyhTju0t0CocctyoM+G56vH7NpQ==",
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.2.2.tgz",
"integrity": "sha512-hrtqpQ5L6IPn5v7yVRo7uvLcQxv0z1+KBjZBWMBOcrXz4t+PKUxU/SWd6Tl9T8FDmYlunzKUh6lcx+2CLo6f5A==",
"dev": true,
"requires": {
"@babel/parser": "^7.13.9",
"@babel/types": "^7.13.0",
"@types/estree": "^0.0.48",
"@vue/compiler-core": "3.2.1",
"@vue/compiler-dom": "3.2.1",
"@vue/compiler-ssr": "3.2.1",
"@vue/shared": "3.2.1",
"@vue/compiler-core": "3.2.2",
"@vue/compiler-dom": "3.2.2",
"@vue/compiler-ssr": "3.2.2",
"@vue/shared": "3.2.2",
"consolidate": "^0.16.0",
"estree-walker": "^2.0.1",
"hash-sum": "^2.0.0",
@@ -32431,12 +32512,12 @@
}
},
"@vue/compiler-ssr": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.2.1.tgz",
"integrity": "sha512-6YAOtQunuEyYlVSjK1F7a7BXi7rxVfiTiJ0Ro7eq0q0MNCFV9Z+sN68lfa/E4ABVb0ledEY/Rt8kL23nwCoTCQ==",
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.2.2.tgz",
"integrity": "sha512-rVl1agMFhdEN3Go0bCriXo+3cysxKIuRP0yh1Wd8ysRrKfAmokyDhUA8PrGSq2Ymj/LdZTh+4OKfj3p2+C+hlA==",
"requires": {
"@vue/compiler-dom": "3.2.1",
"@vue/shared": "3.2.1"
"@vue/compiler-dom": "3.2.2",
"@vue/shared": "3.2.2"
}
},
"@vue/component-compiler-utils": {
@@ -32524,45 +32605,45 @@
"requires": {}
},
"@vue/reactivity": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.2.1.tgz",
"integrity": "sha512-4Lja2KmyiKvuraDed6dXK2A6+r/7x7xGDA7vVR2Aqc8hQVu0+FWeVX+IBfiVOSpbZXFlHLNmCBFkbuWLQSlgxg==",
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.2.2.tgz",
"integrity": "sha512-IHjhtmrhK6dzacj/EnLQDWOaA3HuzzVk6w84qgV8EpS4uWGIJXiRalMRg6XvGW2ykJvIl3pLsF0aBFlTMRiLOA==",
"requires": {
"@vue/shared": "3.2.1"
"@vue/shared": "3.2.2"
}
},
"@vue/runtime-core": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.2.1.tgz",
"integrity": "sha512-IsgelRM/5hYeRhz5+ECi66XvYDdjG2t4lARjHvCXw5s9Q4N6uIbjLMwtLzAWRxYf3/y258BrD+ehxAi943ScJg==",
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.2.2.tgz",
"integrity": "sha512-/aUk1+GO/VPX0oVxhbzSWE1zrf3/wGCsO1ALNisVokYftKqfqLDjbJHE6mrI2hx3MiuwbHrWjJClkGUVTIOPEQ==",
"requires": {
"@vue/reactivity": "3.2.1",
"@vue/shared": "3.2.1"
"@vue/reactivity": "3.2.2",
"@vue/shared": "3.2.2"
}
},
"@vue/runtime-dom": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.2.1.tgz",
"integrity": "sha512-bUAHUSe49A5wYdHQ8wsLU1CMPXaG2fRuv2661mx/6Q9+20QxglT3ss8ZeL6AVRu16JNJMcdvTTsNpbnMbVc/lQ==",
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.2.2.tgz",
"integrity": "sha512-1Le/NpCfawCOfePfJezvWUF+oCVLU8N+IHN4oFDOxRe6/PgHNJ+yT+YdxFifBfI+TIAoXI/9PsnqzmJZV+xsmw==",
"requires": {
"@vue/runtime-core": "3.2.1",
"@vue/shared": "3.2.1",
"@vue/runtime-core": "3.2.2",
"@vue/shared": "3.2.2",
"csstype": "^2.6.8"
}
},
"@vue/server-renderer": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.2.1.tgz",
"integrity": "sha512-Zphh7jjysefw4c4mqy2gDlg5W1MYpYuXPlbv2qnjr4IQHjR/FXQfrqo7U858SOCGXL7sXvx025/BstefP4WBTg==",
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.2.2.tgz",
"integrity": "sha512-o2EcPOeDfXvSK85OhdUWVUYumFW57+MwGFCszOqka2EFpOQVrzvUtYeF6KN2kCuAxexnuVQYtIDQwPZRchXSnQ==",
"requires": {
"@vue/compiler-ssr": "3.2.1",
"@vue/shared": "3.2.1"
"@vue/compiler-ssr": "3.2.2",
"@vue/shared": "3.2.2"
}
},
"@vue/shared": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.2.1.tgz",
"integrity": "sha512-INN92dVBNgd0TW9BqfQQKx/HWGCHhUUbAV5EZ5FgSCiEdwuZsJbGt1mdnaD9IxGhpiyOjP2ClxGG8SFp7ELcWg=="
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.2.2.tgz",
"integrity": "sha512-dvYb318tk9uOzHtSaT3WII/HscQSIRzoCZ5GyxEb3JlkEXASpAUAQwKnvSe2CudnF8XHFRTB7VITWSnWNLZUtA=="
},
"@vue/test-utils": {
"version": "2.0.0-rc.12",
@@ -34158,9 +34239,9 @@
}
},
"caniuse-lite": {
"version": "1.0.30001249",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001249.tgz",
"integrity": "sha512-vcX4U8lwVXPdqzPWi6cAJ3FnQaqXbBqy/GZseKNQzRj37J7qZdGcBtxq/QLFNLLlfsoXLUdHw8Iwenri86Tagw==",
"version": "1.0.30001251",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001251.tgz",
"integrity": "sha512-HOe1r+9VkU4TFmnU70z+r7OLmtR+/chB1rdcJUeQlAinjEeb0cKL20tlAtOagNZhbrtLnCvV19B4FmF1rgzl6A==",
"dev": true
},
"capture-exit": {
@@ -34225,6 +34306,11 @@
"integrity": "sha512-mT8iDcrh03qDGRRmoA2hmBJnxpllMR+0/0qlzjqZES6NdiWDcZkCNAk4rPFZ9Q85r27unkiNNg8ZOiwZXBHwcA==",
"dev": true
},
"chart.js": {
"version": "3.5.0",
"resolved": "https://registry.npmjs.org/chart.js/-/chart.js-3.5.0.tgz",
"integrity": "sha512-J1a4EAb1Gi/KbhwDRmoovHTRuqT8qdF0kZ4XgwxpGethJHUdDrkqyPYwke0a+BuvSeUxPf8Cos6AX2AB8H8GLA=="
},
"check-types": {
"version": "8.0.3",
"resolved": "https://registry.npmjs.org/check-types/-/check-types-8.0.3.tgz",
@@ -34667,9 +34753,9 @@
}
},
"colorette": {
"version": "1.2.2",
"resolved": "https://registry.npmjs.org/colorette/-/colorette-1.2.2.tgz",
"integrity": "sha512-MKGMzyfeuutC/ZJ1cba9NqcNpfeqMUcYmyF1ZFY6/Cn7CNSAKx6a+s48sqLqyAiZuaP2TcqMhoo+dlwFnVxT9w==",
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/colorette/-/colorette-1.3.0.tgz",
"integrity": "sha512-ecORCqbSFP7Wm8Y6lyqMJjexBQqXSF7SSeaTyGGphogUjBlFP9m9o08wy86HL2uB7fMTxtOUzLMk7ogKcxMg1w==",
"dev": true
},
"combined-stream": {
@@ -36026,9 +36112,9 @@
}
},
"electron-to-chromium": {
"version": "1.3.801",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.801.tgz",
"integrity": "sha512-xapG8ekC+IAHtJrGBMQSImNuN+dm+zl7UP1YbhvTkwQn8zf/yYuoxfTSAEiJ9VDD+kjvXaAhNDPSxJ+VImtAJA==",
"version": "1.3.803",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.803.tgz",
"integrity": "sha512-tmRK9qB8Zs8eLMtTBp+w2zVS9MUe62gQQQHjYdAc5Zljam3ZIokNb+vZLPRz9RCREp6EFRwyhOFwbt1fEriQ2Q==",
"dev": true
},
"elegant-spinner": {
@@ -38363,10 +38449,13 @@
"dev": true
},
"is-bigint": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/is-bigint/-/is-bigint-1.0.3.tgz",
"integrity": "sha512-ZU538ajmYJmzysE5yU4Y7uIrPQ2j704u+hXFiIPQExpqzzUbpe5jCPdTfmz7jXRxZdvjY3KZ3ZNenoXQovX+Dg==",
"dev": true
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/is-bigint/-/is-bigint-1.0.4.tgz",
"integrity": "sha512-zB9CruMamjym81i2JZ3UMn54PKGsQzsJeo6xvN3HJJ4CAsQNB6iRutp2To77OfCNuoxspsIhzaPoO1zyCEhFOg==",
"dev": true,
"requires": {
"has-bigints": "^1.0.1"
}
},
"is-binary-path": {
"version": "2.1.0",
@@ -43081,9 +43170,9 @@
"optional": true
},
"nanoid": {
"version": "3.1.23",
"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.23.tgz",
"integrity": "sha512-FiB0kzdP0FFVGDKlRLEQ1BgDzU87dy5NnzjeW9YZNt+/c3+q82EQDUwniSAUxp/F0gFNI1ZhKU1FqYsMuqZVnw==",
"version": "3.1.25",
"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.25.tgz",
"integrity": "sha512-rdwtIXaXCLFAQbnfqDRnI6jaRHp9fTcYBjtFKE8eezcZ7LuLjhUaQGNeMXf1HmRoCH32CLz6XwX0TtxEOS/A3Q==",
"dev": true
},
"nanomatch": {
@@ -43425,9 +43514,9 @@
}
},
"node-releases": {
"version": "1.1.73",
"resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.73.tgz",
"integrity": "sha512-uW7fodD6pyW2FZNZnp/Z3hvWKeEW1Y8R1+1CnErE8cXFXzl5blBOoVB41CvMer6P6Q0S5FXDwcHgFd1Wj0U9zg==",
"version": "1.1.74",
"resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.74.tgz",
"integrity": "sha512-caJBVempXZPepZoZAPCWRTNxYQ+xtG/KAi4ozTA5A+nJ7IU+kLQCbqaUjb5Rwy14M9upBWiQ4NutcmW04LJSRw==",
"dev": true
},
"node-status-codes": {
@@ -47539,9 +47628,9 @@
}
},
"tslib": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.0.tgz",
"integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==",
"version": "2.3.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.1.tgz",
"integrity": "sha512-77EbyPPpMz+FRFRuAFlWMtmgUWGe9UOG2Z25NqCwiIjRhOf5iKGuzSe5P2w1laq+FkRy4p+PCuVkJSGkzTEKVw==",
"dev": true
},
"tsutils": {
@@ -47983,13 +48072,13 @@
"dev": true
},
"vue": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/vue/-/vue-3.2.1.tgz",
"integrity": "sha512-0jhXluF5mzTAK5bXw/8yq4McvsI8HwEWI4cnQwJeN8NYGRbwh9wwuE4FNv1Kej9pxBB5ajTNsWr0M6DPs5EJZg==",
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/vue/-/vue-3.2.2.tgz",
"integrity": "sha512-D/LuzAV30CgNJYGyNheE/VUs5N4toL2IgmS6c9qeOxvyh0xyn4exyRqizpXIrsvfx34zG9x5gCI2tdRHCGvF9w==",
"requires": {
"@vue/compiler-dom": "3.2.1",
"@vue/runtime-dom": "3.2.1",
"@vue/shared": "3.2.1"
"@vue/compiler-dom": "3.2.2",
"@vue/runtime-dom": "3.2.2",
"@vue/shared": "3.2.2"
}
},
"vue-eslint-parser": {
package.json
+3 -1
View File
@@ -16,7 +16,9 @@
"@coreui/coreui": "^4.0.1",
"@coreui/icons": "^2.0.1",
"@coreui/icons-vue": "2.0.0-alpha.0",
"@coreui/vue": "^4.0.0-alpha.0",
"@coreui/utils": "^1.3.1",
"@coreui/vue": "^4.0.0-alpha.2",
"@coreui/vue-chartjs": "2.0.0-alpha.0",
"core-js": "^3.6.5",
"vue": "^3.0.0",
"vue-router": "^4.0.0-0",
src/_nav.js
+6 -6
View File
@@ -147,12 +147,12 @@ export default [
// }
]
},
// {
// _name: 'CNavItem',
// name: 'Charts',
// to: '/charts',
// icon: 'cil-chart-pie'
// },
{
_name: 'CNavItem',
name: 'Charts',
to: '/charts',
icon: 'cil-chart-pie'
},
{
_name: 'CNavGroup',
name: 'Icons',
src/router/index.js
+5
View File
@@ -168,6 +168,11 @@ const routes = [
*/
]
},
{
path: "/charts",
name: "Charts",
component: () => import("@/views/charts/Charts.vue"),
},
{
path: "/icons",
name: "Icons",
src/views/Dashboard.vue
+490 -2
View File
@@ -1,5 +1,493 @@
<template>
<div class="dashboard">
<h1>Dashboard</h1>
<div>
<CRow>
<CCol md="12">
<CCard>
<CCardBody>
<CRow>
<CCol sm="5">
<h4 id="traffic" class="card-title mb-0">Traffic</h4>
<div class="small text-muted">November 2017</div>
</CCol>
<CCol sm="7" class="d-none d-md-block">
<CButton color="primary" class="float-right">
<CIcon name="cil-cloud-download"/>
</CButton>
<CButtonGroup class="float-right mr-3">
<CButton
color="outline-secondary"
v-for="(value, key) in ['Day', 'Month', 'Year']"
:key="key"
class="mx-0"
:pressed="value === selected ? true : false"
@click="selected = value"
>
{{value}}
</CButton>
</CButtonGroup>
</CCol>
</CRow>
<CRow>
<MainChartExample style="height:300px;max-height:300px;margin-top:40px;"/>
</CRow>
</CCardBody>
</CCard>
</CCol>
<CCol md="12" class="mt-4">
<CCard>
<CCardBody>
<CRow class="text-center">
<CCol md sm="12" class="mb-sm-2 mb-0">
<div class="text-muted">Visits</div>
<strong>29.703 Users (40%)</strong>
<CProgress
class="progress-xs mt-2"
:precision="1"
color="success"
:value="40"
/>
</CCol>
<CCol md sm="12" class="mb-sm-2 mb-0 d-md-down-none">
<div class="text-muted">Unique</div>
<strong>24.093 Users (20%)</strong>
<CProgress
class="progress-xs mt-2"
:precision="1"
color="info"
:value="20"
/>
</CCol>
<CCol md sm="12" class="mb-sm-2 mb-0">
<div class="text-muted">Pageviews</div>
<strong>78.706 Views (60%)</strong>
<CProgress
class="progress-xs mt-2"
:precision="1"
color="warning"
:value="60"
/>
</CCol>
<CCol md sm="12" class="mb-sm-2 mb-0">
<div class="text-muted">New Users</div>
<strong>22.123 Users (80%)</strong>
<CProgress
class="progress-xs mt-2"
:precision="1"
color="danger"
:value="80"
/>
</CCol>
<CCol md sm="12" class="mb-sm-2 mb-0 d-md-down-none">
<div class="text-muted">Bounce Rate</div>
<strong>Average Rate (40.15%)</strong>
<CProgress
class="progress-xs mt-2"
:precision="1"
:value="40"
/>
</CCol>
</CRow>
</CCardBody>
</CCard>
</CCol>
</CRow>
<CRow>
<CCol md="12">
<CCard>
<CCardHeader>
Traffic &amp; Sales
</CCardHeader>
<CCardBody>
<CRow>
<CCol sm="12" lg="6">
<CRow>
<CCol sm="6">
<CCallout color="info">
<small class="text-muted">New Clients</small><br>
<strong class="h4">9,123</strong>
</CCallout>
</CCol>
<CCol sm="6">
<CCallout color="danger">
<small class="text-muted">Recurring Clients</small><br>
<strong class="h4">22,643</strong>
</CCallout>
</CCol>
</CRow>
<hr class="mt-0">
<div class="progress-group mb-4">
<div class="progress-group-prepend">
<span class="progress-group-text">
Monday
</span>
</div>
<div class="progress-group-bars">
<CProgress
class="progress-xs"
color="info"
:value="34"
/>
<CProgress
class="progress-xs"
color="danger"
:value="78"
/>
</div>
</div>
<div class="progress-group mb-4">
<div class="progress-group-prepend">
<span class="progress-group-text">
Tuesday
</span>
</div>
<div class="progress-group-bars">
<CProgress
class="progress-xs"
:value="56"
color="info"
/>
<CProgress
class="progress-xs"
:value="94"
color="danger"
/>
</div>
</div>
<div class="progress-group mb-4">
<div class="progress-group-prepend">
<span class="progress-group-text">
Wednesday
</span>
</div>
<div class="progress-group-bars">
<CProgress
class="progress-xs"
:value="12"
color="info"
/>
<CProgress
class="progress-xs"
:value="67"
color="danger"
/>
</div>
</div>
<div class="progress-group mb-4">
<div class="progress-group-prepend">
<span class="progress-group-text">
Thursday
</span>
</div>
<div class="progress-group-bars">
<CProgress
class="progress-xs"
:value="43"
color="info"
/>
<CProgress
class="progress-xs"
:value="91"
color="danger"
/>
</div>
</div>
<div class="progress-group mb-4">
<div class="progress-group-prepend">
<span class="progress-group-text">
Friday
</span>
</div>
<div class="progress-group-bars">
<CProgress
class="progress-xs"
:value="22"
color="info"
/>
<CProgress
class="progress-xs"
:value="73"
color="danger"
/>
</div>
</div>
<div class="progress-group mb-4">
<div class="progress-group-prepend">
<span class="progress-group-text">
Saturday
</span>
</div>
<div class="progress-group-bars">
<CProgress
class="progress-xs"
:value="53"
color="info"
/>
<CProgress
class="progress-xs"
:value="82"
color="danger"
/>
</div>
</div>
<div class="progress-group mb-4">
<div class="progress-group-prepend">
<span class="progress-group-text">
Sunday
</span>
</div>
<div class="progress-group-bars">
<CProgress
class="progress-xs"
:value="9"
color="info"
/>
<CProgress
class="progress-xs"
:value="69"
color="danger"
/>
</div>
</div>
<div class="legend text-center">
<small>
<sup><CBadge shape="pill" color="info">&nbsp;</CBadge></sup>
New clients
&nbsp;&nbsp;
<sup><CBadge shape="pill" color="danger">&nbsp;</CBadge></sup>
Recurring clients
</small>
</div>
</CCol>
<CCol sm="12" lg="6">
<CRow>
<CCol sm="6">
<CCallout color="warning">
<small class="text-muted">Pageviews</small><br>
<strong class="h4">78,623</strong>
</CCallout>
</CCol>
<CCol sm="6">
<CCallout color="success">
<small class="text-muted">Organic</small><br>
<strong class="h4">49,123</strong>
</CCallout>
</CCol>
</CRow>
<hr class="mt-0">
<ul class="horizontal-bars type-2">
<div class="progress-group">
<div class="progress-group-header">
<CIcon name="cil-user" class="progress-group-icon"/>
<span class="title">Male</span>
<span class="ml-auto font-weight-bold">43%</span>
</div>
<div class="progress-group-bars">
<CProgress
class="progress-xs"
:value="43"
color="warning"
/>
</div>
</div>
<div class="progress-group mb-5">
<div class="progress-group-header">
<CIcon name="cil-user-female" class="progress-group-icon"/>
<span class="title">Female</span>
<span class="ml-auto font-weight-bold">37%</span>
</div>
<div class="progress-group-bars">
<CProgress
class="progress-xs"
:value="37"
color="warning"
/>
</div>
</div>
<div class="progress-group">
<div class="progress-group-header">
<CIcon name="cil-globe-alt" class="progress-group-icon"/>
<span class="title">Organic Search</span>
<span class="ml-auto font-weight-bold">
191,235 <span class="text-muted small">(56%)</span>
</span>
</div>
<div class="progress-group-bars">
<CProgress
class="progress-xs"
:value="56"
color="success"
/>
</div>
</div>
<div class="progress-group">
<div class="progress-group-header">
<CIcon
name="cib-facebook"
height="17"
class="progress-group-icon"
/>
<span class="title">Facebook</span>
<span class="ml-auto font-weight-bold">
51,223 <span class="text-muted small">(15%)</span>
</span>
</div>
<div class="progress-group-bars">
<CProgress
class="progress-xs"
:value="15"
color="success"
/>
</div>
</div>
<div class="progress-group">
<div class="progress-group-header">
<CIcon
name="cib-twitter"
height="17"
class="progress-group-icon"
/>
<span class="title">Twitter</span>
<span class="ml-auto font-weight-bold">
37,564 <span class="text-muted small">(11%)</span>
</span>
</div>
<div class="progress-group-bars">
<CProgress
class="progress-xs"
:value="11"
color="success"
/>
</div>
</div>
<div class="progress-group">
<div class="progress-group-header">
<CIcon
name="cib-linkedin"
height="17"
class="progress-group-icon"
/>
<span class="title">LinkedIn</span>
<span class="ml-auto font-weight-bold">
27,319 <span class="text-muted small">&nbsp;(8%)</span>
</span>
</div>
<div class="progress-group-bars">
<CProgress
class="progress-xs"
:value="8"
color="success"
/>
</div>
</div>
<div class="divider text-center">
<CButton color="link" size="sm" class="text-muted">
<CIcon name="cil-options"/>
</CButton>
</div>
</ul>
</CCol>
</CRow>
<br/>
<CDataTable
class="mb-0 table-outline"
hover
:items="tableItems"
:fields="tableFields"
head-color="light"
no-sorting
>
</CDataTable>
</CCardBody>
</CCard>
</CCol>
</CRow>
</div>
</template>
<script>
import MainChartExample from './charts/MainChartExample'
export default {
name: 'Dashboard',
components: {
MainChartExample,
},
data () {
return {
selected: 'Month',
tableItems: [
{
avatar: { url: 'img/avatars/1.jpg', status: 'success' },
user: { name: 'Yiorgos Avraamu', new: true, registered: 'Jan 1, 2015' },
country: { name: 'USA', flag: 'cif-us' },
usage: { value: 50, period: 'Jun 11, 2015 - Jul 10, 2015' },
payment: { name: 'Mastercard', icon: 'cib-cc-mastercard' },
activity: '10 sec ago'
},
{
avatar: { url: 'img/avatars/2.jpg', status: 'danger' },
user: { name: 'Avram Tarasios', new: false, registered: 'Jan 1, 2015' },
country: { name: 'Brazil', flag: 'cif-br' },
usage: { value: 22, period: 'Jun 11, 2015 - Jul 10, 2015' },
payment: { name: 'Visa', icon: 'cib-cc-visa' },
activity: '5 minutes ago'
},
{
avatar: { url: 'img/avatars/3.jpg', status: 'warning' },
user: { name: 'Quintin Ed', new: true, registered: 'Jan 1, 2015' },
country: { name: 'India', flag: 'cif-in' },
usage: { value: 74, period: 'Jun 11, 2015 - Jul 10, 2015' },
payment: { name: 'Stripe', icon: 'cib-stripe' },
activity: '1 hour ago'
},
{
avatar: { url: 'img/avatars/4.jpg', status: '' },
user: { name: 'Enéas Kwadwo', new: true, registered: 'Jan 1, 2015' },
country: { name: 'France', flag: 'cif-fr' },
usage: { value: 98, period: 'Jun 11, 2015 - Jul 10, 2015' },
payment: { name: 'PayPal', icon: 'cib-paypal' },
activity: 'Last month'
},
{
avatar: { url: 'img/avatars/5.jpg', status: 'success' },
user: { name: 'Agapetus Tadeáš', new: true, registered: 'Jan 1, 2015' },
country: { name: 'Spain', flag: 'cif-es' },
usage: { value: 22, period: 'Jun 11, 2015 - Jul 10, 2015' },
payment: { name: 'Google Wallet', icon: 'cib-google-pay' },
activity: 'Last week'
},
{
avatar: { url: 'img/avatars/6.jpg', status: 'danger' },
user: { name: 'Friderik Dávid', new: true, registered: 'Jan 1, 2015' },
country: { name: 'Poland', flag: 'cif-pl' },
usage: { value: 43, period: 'Jun 11, 2015 - Jul 10, 2015' },
payment: { name: 'Amex', icon: 'cib-cc-amex' },
activity: 'Last week'
}
],
tableFields: [
{ key: 'avatar', label: '', _classes: 'text-center' },
{ key: 'user' },
{ key: 'country', _classes: 'text-center' },
{ key: 'usage' },
{ key: 'payment', label: 'Payment method', _classes: 'text-center' },
{ key: 'activity' },
]
}
},
methods: {
color (value) {
let $color
if (value <= 25) {
$color = 'info'
} else if (value > 25 && value <= 50) {
$color = 'success'
} else if (value > 50 && value <= 75) {
$color = 'warning'
} else if (value > 75 && value <= 100) {
$color = 'danger'
}
return $color
}
}
}
</script>
src/views/Widgets.vue
+145
View File
@@ -6,8 +6,142 @@
<strong>Vue Widgets</strong>
</CCardHeader>
<CCardBody>
<h4 class="mt-4">Simple Widgets</h4>
<Example href="">
<CRow>
<CCol class="mt-4" md="4">
<CWidgetSimple title="Lorem" value="3,141"/>
</CCol>
<CCol class="mt-4" md="4">
<CWidgetSimple title="Ipsum" value="5,926"/>
</CCol>
<CCol class="mt-4" md="4">
<CWidgetSimple title="Dolor" value="5,358"/>
</CCol>
</CRow>
<CRow>
<CCol class="mt-4" md="6">
<CWidgetSimple title="Lorem" value="3,141"/>
</CCol>
<CCol class="mt-4" md="6">
<CWidgetSimple title="Ipsum" value="5,926"/>
</CCol>
</CRow>
</Example>
<h4 class="mt-4">Brand Widgets</h4>
<Example href="">
<CRow>
<CCol class="mt-4" md="4">
<CWidgetBrand color="primary" :values="[['Lorem', '3,141'], ['Dolor', '5,926']]"/>
</CCol>
<CCol class="mt-4" md="4">
<CWidgetBrand color="success" :values="[['Lorem', '3,141'], ['Dolor', '5,926']]"/>
</CCol>
<CCol class="mt-4" md="4">
<CWidgetBrand color="danger" :values="[['Lorem', '3,141'], ['Dolor', '5,926']]"/>
</CCol>
</CRow>
<CRow>
<CCol class="mt-4" md="6">
<CWidgetBrand color="info" :values="[['Lorem', '3,141'], ['Dolor', '5,926']]"/>
</CCol>
<CCol class="mt-4" md="6">
<CWidgetBrand color="secondary" :values="[['Lorem', '3,141'], ['Dolor', '5,926']]"/>
</CCol>
</CRow>
</Example>
<h4 class="mt-4">Dropdown Widgets</h4>
<Example href="">
<CRow>
<CCol class="mt-4" v-for="(item, index) in ['primary', 'success', 'danger', 'info', 'secondary']" :md="index<3 ? 4 : 6">
<CWidgetDropdown :color="item">
<template #value>
3,141
</template>
<template #change>
Dolor emit
</template>
<template #title>
<p>Lorem ipsum</p>
</template>
<template #action>
<CDropdown>
<CDropdownToggle :color="item" class="text-white">Dropdown Button</CDropdownToggle>
<CDropdownMenu>
<CDropdownItem href="#">Action</CDropdownItem>
<CDropdownItem href="#">Another action</CDropdownItem>
<CDropdownItem href="#">Something else here</CDropdownItem>
</CDropdownMenu>
</CDropdown>
</template>
</CWidgetDropdown>
</CCol>
</CRow>
</Example>
<h4 class="mt-4">Brand Widgets</h4>
<Example href="">
<CRow>
<CCol class="mt-4" md="4">
<CWidgetIcon color="primary" title="Lorem ipsum" value="3,141">
<template #default>
<CIcon name="cil-puzzle" size="lg"/>
</template>
</CWidgetIcon>
</CCol>
<CCol class="mt-4" md="4">
<CWidgetIcon color="success" title="Lorem ipsum" value="5,926">
<template #default>
<CIcon name="cil-speedometer" size="lg"/>
</template>
</CWidgetIcon>
</CCol>
<CCol class="mt-4" md="4">
<CWidgetIcon color="danger" title="Lorem ipsum" value="5,358">
<template #default>
<CIcon name="cil-cursor" size="lg"/>
</template>
</CWidgetIcon>
</CCol>
<CCol class="mt-4" md="6">
<CWidgetIcon color="info" title="Lorem ipsum" value="3,141">
<template #default>
<CIcon name="cil-drop" size="lg"/>
</template>
</CWidgetIcon>
</CCol>
<CCol class="mt-4" md="6">
<CWidgetIcon color="secondary" title="Lorem ipsum" value="5,926">
<template #default>
<CIcon name="cil-pencil" size="lg"/>
</template>
</CWidgetIcon>
</CCol>
</CRow>
</Example>
<h4 class="mt-4">Progress Widgets</h4>
<Example href="">
<CRow>
<CCol class="mt-4" v-for="(item, index) in ['primary', 'success', 'danger', 'info', 'secondary']" :md="index<3 ? 4 : 6">
<CWidgetProgress :color="item" progressValue="70" text="Lorem ipsum" title="Dolor cet emit" value="3,141" inverse/>
</CCol>
</CRow>
</Example>
<h4 class="mt-4">Progress Icon Widgets</h4>
<Example href="">
<CRow>
<CCol class="mt-4" v-for="(item, index) in widgetProgressIconItems" :md="index<3 ? 4 : 6">
<CWidgetProgressIcon :color="item.color" progressValue="70" text="Lorem ipsum" title="Dolor cet emit" value="3,141" inverse>
<template #icon>
<CIcon :name="item.icon" size="lg"/>
</template>
</CWidgetProgressIcon>
</CCol>
</CRow>
</Example>
</CCardBody>
</CCard>
@@ -18,5 +152,16 @@
<script>
export default {
name: "Widgets",
data: function(){
return {
widgetProgressIconItems: [
{ color: 'primary', icon: 'cil-puzzle'},
{ color: 'success', icon: 'cil-speedometer'},
{ color: 'danger', icon: 'cil-cursor'},
{ color: 'info', icon: 'cil-drop'},
{ color: 'secondary', icon: 'cil-pencil'},
]
}
}
};
</script>
src/views/charts/CChartBarExample.vue
+27
View File
@@ -0,0 +1,27 @@
<template>
<CChartBar
:data="defaultData"
/>
</template>
<script>
import { CChartBar } from '@coreui/vue-chartjs'
export default {
name: 'CChartBarExample',
components: { CChartBar },
computed: {
defaultData () {
return {
labels: ['months'],
datasets: [
{
label: 'GitHub Commits',
backgroundColor: '#f87979',
data: [40, 20, 12, 39, 10, 40, 39, 80, 40, 20, 12, 11]
}
]
}
}
}
}
</script>
src/views/charts/CChartBarSimple.vue
+65
View File
@@ -0,0 +1,65 @@
<template>
<CChartBar
:data="computedData"
/>
</template>
<script>
import { CChartBar } from '@coreui/vue-chartjs'
import { getColor, deepObjectsMerge } from '@coreui/utils/src'
export default {
name: 'CChartBarSimple',
components: { CChartBar },
props: {
...CChartBar.props,
backgroundColor: {
type: String,
default: '#f87979'
},
pointHoverBackgroundColor: String,
dataPoints: {
type: Array,
default: [10, 22, 34, 46, 58, 70, 46, 23, 45, 78, 34, 12]
},
label: {
type: String,
default: 'Sales'
},
pointed: Boolean
},
computed: {
defaultOptions () {
return {
maintainAspectRatio: false,
legend: {
display: false
},
scales: {
xAxes: [{
display: false
}],
yAxes: [{
display: false
}]
}
}
},
computedData () {
return {
labels: ['4','5','6','7','8','9','10','11','12','13','14','15'],
datasets: [
{
data: this.dataPoints,
backgroundColor: getColor(this.backgroundColor),
pointHoverBackgroundColor: getColor(this.pointHoverBackgroundColor),
label: this.label,
barPercentage: 0.5,
categoryPercentage: 1
}
],
options: this.defaultOptions
}
},
}
}
</script>
src/views/charts/CChartDoughnutExample.vue
+31
View File
@@ -0,0 +1,31 @@
<template>
<CChartDoughnut
:data="defaultData"
/>
</template>
<script>
import { CChartDoughnut } from '@coreui/vue-chartjs'
export default {
name: 'CChartDoughnutExample',
components: { CChartDoughnut },
computed: {
defaultData () {
return {
labels: ['VueJs', 'EmberJs', 'ReactJs', 'AngularJs'],
datasets: [
{
backgroundColor: [
'#41B883',
'#E46651',
'#00D8FF',
'#DD1B16'
],
data: [40, 20, 80, 10]
}
],
}
}
}
}
</script>
src/views/charts/CChartLineExample.vue
+30
View File
@@ -0,0 +1,30 @@
<template>
<CChartLine :data="defaultData"/>
</template>
<script>
import { CChartLine } from '@coreui/vue-chartjs'
export default {
name: 'CChartLineExample',
components: { CChartLine },
computed: {
defaultData () {
return {
labels: ['months', 'a', 'b', 'c', 'd'],
datasets: [
{
label: 'Data One',
backgroundColor: 'rgb(228,102,81,0.9)',
data: [30, 39, 10, 50, 30, 70, 35]
},
{
label: 'Data Two',
backgroundColor: 'rgb(0,216,255,0.9)',
data: [39, 80, 40, 35, 40, 20, 45]
}
]
}
}
}
}
</script>
src/views/charts/CChartLineSimple.vue
+83
View File
@@ -0,0 +1,83 @@
<template>
<CChartLine
:data="computedData"
/>
</template>
<script>
import { CChartLine } from '@coreui/vue-chartjs'
import { getColor, deepObjectsMerge } from '@coreui/utils/src'
export default {
name: 'CChartLineSimple',
components: { CChartLine },
props: {
...CChartLine.props,
borderColor: {
type: String,
default: 'rgba(255,255,255,.55)'
},
backgroundColor: {
type: String,
default: 'transparent'
},
dataPoints: {
type: Array,
default: [10, 22, 34, 46, 58, 70, 46, 23, 45, 78, 34, 12]
},
label: {
type: String,
default: 'Sales'
},
pointed: {
type: Boolean,
default: true
},
pointHoverBackgroundColor: String
},
computed: {
pointHoverColor () {
if (this.pointHoverBackgroundColor) {
return this.pointHoverBackgroundColor
} else if (this.backgroundColor !== 'transparent') {
return this.backgroundColor
}
return this.borderColor
},
computedData () {
return {
labels: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11'],
datasets: [
{
data: this.dataPoints,
borderColor: getColor(this.borderColor),
backgroundColor: getColor(this.backgroundColor),
pointBackgroundColor: getColor(this.pointHoverColor),
pointHoverBackgroundColor: getColor(this.pointHoverColor),
label: this.label
}
],
options: {
scales: {
xAxes: [{
display: false
}],
yAxes: [{
display: false
}]
},
elements: {
line: {
borderWidth: 2
},
point: {
radius: 0,
hitRadius: 10,
hoverRadius: 4
}
}
}
}
},
}
}
</script>
src/views/charts/CChartLineSimplePointed.vue
+100
View File
@@ -0,0 +1,100 @@
<template>
<CChartLine
:data="computedData"
/>
</template>
<script>
import { CChartLine } from '@coreui/vue-chartjs'
import { getColor, deepObjectsMerge } from '@coreui/utils/src'
export default {
name: 'CChartLineSimplePointed',
components: { CChartLine },
props: {
...CChartLine.props,
borderColor: {
type: String,
default: 'rgba(255,255,255,.55)'
},
backgroundColor: {
type: String,
default: 'transparent'
},
dataPoints: {
type: Array,
default: [10, 22, 34, 46, 58, 70, 46, 23, 45, 78, 34, 12]
},
label: {
type: String,
default: 'Sales'
},
pointed: {
type: Boolean,
default: true
},
pointHoverBackgroundColor: String
},
computed: {
pointHoverColor () {
if (this.pointHoverBackgroundColor) {
return this.pointHoverBackgroundColor
} else if (this.backgroundColor !== 'transparent') {
return this.backgroundColor
}
return this.borderColor
},
computedData () {
return {
labels: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11'],
datasets: [
{
data: this.dataPoints,
borderColor: getColor(this.borderColor),
backgroundColor: getColor(this.backgroundColor),
pointBackgroundColor: getColor(this.pointHoverColor),
pointHoverBackgroundColor: getColor(this.pointHoverColor),
label: this.label
}
],
options: {
scales: {
xAxes: [
{
offset: true,
gridLines: {
color: 'transparent',
zeroLineColor: 'transparent'
},
ticks: {
fontSize: 2,
fontColor: 'transparent'
}
}
],
yAxes: [
{
display: false,
ticks: {
display: false,
min: Math.min.apply(Math, this.dataPoints) - 5,
max: Math.max.apply(Math, this.dataPoints) + 5
}
}
]
},
elements: {
line: {
borderWidth: 1
},
point: {
radius: 4,
hitRadius: 10,
hoverRadius: 4
}
}
}
}
},
}
}
</script>
src/views/charts/CChartPieExample.vue
+31
View File
@@ -0,0 +1,31 @@
<template>
<CChartPie
:data="defaultData"
/>
</template>
<script>
import { CChartPie } from '@coreui/vue-chartjs'
export default {
name: 'CChartPieExample',
components: { CChartPie },
computed: {
defaultData () {
return {
labels: ['VueJs', 'EmberJs', 'ReactJs', 'AngularJs'],
datasets: [
{
backgroundColor: [
'#41B883',
'#E46651',
'#00D8FF',
'#DD1B16'
],
data: [40, 20, 80, 10]
}
]
}
}
}
}
</script>
src/views/charts/CChartPolarAreaExample.vue
+43
View File
@@ -0,0 +1,43 @@
<template>
<CChartPolarArea
:data="defaultData"
/>
</template>
<script>
import { CChartPolarArea } from '@coreui/vue-chartjs'
export default {
name: 'CChartPolarAreaExample',
components: { CChartPolarArea },
computed: {
defaultData () {
return {
labels: ['Eating', 'Drinking', 'Sleeping', 'Designing', 'Coding', 'Cycling', 'Running'],
datasets: [
{
label: 'My First dataset',
backgroundColor: 'rgba(179,181,198,0.5)',
pointBackgroundColor: 'rgba(179,181,198,1)',
pointBorderColor: '#fff',
pointHoverBackgroundColor: 'rgba(179,181,198,1)',
pointHoverBorderColor: 'rgba(179,181,198,1)',
data: [65, 59, 90, 81, 56, 55, 40]
},
{
label: 'My Second dataset',
backgroundColor: 'rgba(255,99,132,0.5)',
pointBackgroundColor: 'rgba(255,99,132,1)',
pointBorderColor: '#fff',
pointHoverBackgroundColor: 'rgba(255,99,132,1)',
pointHoverBorderColor: 'rgba(255,99,132,1)',
data: [28, 48, 40, 19, 96, 27, 100]
}
],
options: {
aspectRatio: 1.5
}
}
},
}
}
</script>
src/views/charts/CChartRadarExample.vue
+47
View File
@@ -0,0 +1,47 @@
<template>
<CChartRadar
:data="defaultData"
/>
</template>
<script>
import { CChartRadar } from '@coreui/vue-chartjs'
export default {
name: 'CChartRadarExample',
components: { CChartRadar },
computed: {
defaultData () {
return {
labels: ['Eating', 'Drinking', 'Sleeping', 'Designing', 'Coding', 'Cycling', 'Running'],
datasets: [
{
label: '2020',
backgroundColor: 'rgba(179,181,198,0.2)',
borderColor: 'rgba(179,181,198,1)',
pointBackgroundColor: 'rgba(179,181,198,1)',
pointBorderColor: '#fff',
pointHoverBackgroundColor: '#fff',
pointHoverBorderColor: 'rgba(179,181,198,1)',
tooltipLabelColor: 'rgba(179,181,198,1)',
data: [65, 59, 90, 81, 56, 55, 40]
},
{
label: '2021',
backgroundColor: 'rgba(255,99,132,0.2)',
borderColor: 'rgba(255,99,132,1)',
pointBackgroundColor: 'rgba(255,99,132,1)',
pointBorderColor: '#fff',
pointHoverBackgroundColor: '#fff',
pointHoverBorderColor: 'rgba(255,99,132,1)',
tooltipLabelColor: 'rgba(255,99,132,1)',
data: [28, 48, 40, 19, 96, 27, 100]
}
],
options: {
aspectRatio: 1.5
}
}
},
}
}
</script>
src/views/charts/Charts.vue
+76
View File
@@ -0,0 +1,76 @@
<template>
<CRow>
<CCol md="6" class="mt-4">
<CCard>
<CCardHeader>
Line Chart
</CCardHeader>
<CCardBody>
<CChartLineExample/>
</CCardBody>
</CCard>
</CCol>
<CCol md="6" class="mt-4">
<CCard>
<CCardHeader>Bar Chart</CCardHeader>
<CCardBody><CChartBarExample/></CCardBody>
</CCard>
</CCol>
<CCol md="6" class="mt-4">
<CCard>
<CCardHeader>Doughnut Chart</CCardHeader>
<CCardBody><CChartDoughnutExample/></CCardBody>
</CCard>
</CCol>
<CCol md="6" class="mt-4">
<CCard>
<CCardHeader>Radar Chart</CCardHeader>
<CCardBody><CChartRadarExample/></CCardBody>
</CCard>
</CCol>
<CCol md="6" class="mt-4">
<CCard>
<CCardHeader>Pie Chart</CCardHeader>
<CCardBody><CChartPieExample/></CCardBody>
</CCard>
</CCol>
<CCol md="6" class="mt-4">
<CCard>
<CCardHeader>Polar Area Chart</CCardHeader>
<CCardBody><CChartPolarAreaExample/></CCardBody>
</CCard>
</CCol>
<CCol md="6" class="mt-4">
<CCard>
<CCardHeader>Simple line chart</CCardHeader>
<CCardBody>
<CChartLineSimple border-color="success" labels="months"/>
</CCardBody>
</CCard>
</CCol>
<!--
<CCol md="6" class="mt-4">
<CCard>
<CCardHeader>Simple pointed chart</CCardHeader>
<CCardBody><CChartLineSimplePointed :pointed="true" border-color="warning"/></CCardBody>
</CCard>
</CCol>
-->
<CCol md="6" class="mt-4">
<CCard>
<CCardHeader>Simple bar chart</CCardHeader>
<CCardBody><CChartBarSimple background-color="danger"/></CCardBody>
</CCard>
</CCol>
</CRow>
</template>
<script>
import * as Charts from './index.js'
export default {
name: 'Charts',
components: {
...Charts
}
}
</script>
src/views/charts/MainChartExample.vue
+110
View File
@@ -0,0 +1,110 @@
<template>
<div class="chart-container" style="position: relative; height:100px;">
<CChartLine :data="defaultData" />
</div>
</template>
<script>
import { CChartLine } from '@coreui/vue-chartjs'
import { getStyle, hexToRgba } from '@coreui/utils/src'
function random (min, max) {
return Math.floor(Math.random() * (max - min + 1) + min)
}
export default {
name: 'MainChartExample',
components: {
CChartLine
},
computed: {
defaultData () {
return {
labels: ['Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa', 'Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa', 'Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa', 'Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa', 'Su'],
datasets: this.defaultDatasets,
options: this.defaultOptions
}
},
defaultDatasets () {
const brandSuccess = getStyle('success2') || '#4dbd74'
const brandInfo = getStyle('info') || '#20a8d8'
const brandDanger = getStyle('danger') || '#f86c6b'
let elements = 27
const data1 = []
const data2 = []
const data3 = []
for (let i = 0; i <= elements; i++) {
data1.push(random(50, 200))
data2.push(random(80, 100))
data3.push(65)
}
return [
{
label: 'My First dataset',
backgroundColor: hexToRgba(brandInfo, 10),
borderColor: brandInfo,
pointHoverBackgroundColor: brandInfo,
borderWidth: 2,
data: data1
},
{
label: 'My Second dataset',
backgroundColor: 'transparent',
borderColor: brandSuccess,
pointHoverBackgroundColor: brandSuccess,
borderWidth: 2,
data: data2
},
{
label: 'My Third dataset',
backgroundColor: 'transparent',
borderColor: brandDanger,
pointHoverBackgroundColor: brandDanger,
borderWidth: 1,
borderDash: [8, 5],
data: data3
}
]
},
defaultOptions () {
return {
maintainAspectRatio: false,
aspectRatio: 30,
legend: {
display: false
},
scales: {
xAxes: [{
gridLines: {
drawOnChartArea: false
}
}],
yAxes: [{
ticks: {
beginAtZero: true,
maxTicksLimit: 5,
stepSize: Math.ceil(250 / 5),
max: 250
},
gridLines: {
display: true
}
}]
},
elements: {
point: {
radius: 0,
hitRadius: 10,
hoverRadius: 4,
hoverBorderWidth: 3
}
}
}
}
}
}
</script>
<style>
.chart-wrapper canvas{
max-height: 288px;
}
</style>
src/views/charts/index.js
+21
View File
@@ -0,0 +1,21 @@
import CChartLineSimple from './CChartLineSimple'
import CChartLineSimplePointed from './CChartLineSimplePointed'
import CChartBarSimple from './CChartBarSimple'
import CChartLineExample from './CChartLineExample'
import CChartBarExample from './CChartBarExample'
import CChartDoughnutExample from './CChartDoughnutExample'
import CChartRadarExample from './CChartRadarExample'
import CChartPieExample from './CChartPieExample'
import CChartPolarAreaExample from './CChartPolarAreaExample'
export {
CChartLineSimple,
CChartLineSimplePointed,
CChartBarSimple,
CChartLineExample,
CChartBarExample,
CChartDoughnutExample,
CChartRadarExample,
CChartPieExample,
CChartPolarAreaExample
}