├── .gitignore ├── App.vue ├── README.md ├── components ├── Beans │ └── Beans.vue └── ql │ ├── envs │ └── envs.vue │ └── list │ └── list.vue ├── index.html ├── main.js ├── manifest.json ├── package.json ├── pages.json ├── pages ├── about │ └── about.vue ├── jd │ ├── jd.vue │ ├── login │ │ └── login.vue │ └── setting │ │ └── setting.vue └── ql_panel │ ├── config │ └── config.vue │ ├── cron_detail │ └── cron_detail.vue │ ├── cron_log │ └── cron_log.vue │ ├── env_detail │ └── env_detail.vue │ ├── login │ └── login.vue │ └── ql_panel.vue ├── static ├── logo.png └── tabbar │ ├── account-fill.png │ ├── account.png │ ├── calendar-fill.png │ ├── calendar.png │ ├── consumption-fill.png │ ├── consumption.png │ ├── home-fill.png │ └── home.png ├── store └── index.js ├── uni.scss ├── uni_modules ├── qiun-data-charts │ ├── changelog.md │ ├── components │ │ ├── qiun-data-charts │ │ │ └── qiun-data-charts.vue │ │ ├── qiun-error │ │ │ └── qiun-error.vue │ │ └── qiun-loading │ │ │ ├── loading1.vue │ │ │ ├── loading2.vue │ │ │ ├── loading3.vue │ │ │ ├── loading4.vue │ │ │ ├── loading5.vue │ │ │ └── qiun-loading.vue │ ├── js_sdk │ │ └── u-charts │ │ │ ├── config-echarts.js │ │ │ ├── config-ucharts.js │ │ │ ├── readme.md │ │ │ └── u-charts.js │ ├── license.md │ ├── package.json │ ├── readme.md │ └── static │ │ ├── app-plus │ │ └── echarts.min.js │ │ └── h5 │ │ └── echarts.min.js ├── uni-link │ ├── changelog.md │ ├── components │ │ └── uni-link │ │ │ └── uni-link.vue │ ├── package.json │ └── readme.md └── uni-scss │ ├── changelog.md │ ├── index.scss │ ├── package.json │ ├── readme.md │ ├── styles │ ├── index.scss │ ├── setting │ │ ├── _border.scss │ │ ├── _color.scss │ │ ├── _radius.scss │ │ ├── _space.scss │ │ ├── _styles.scss │ │ ├── _text.scss │ │ └── _variables.scss │ └── tools │ │ └── functions.scss │ ├── theme.scss │ └── variables.scss └── utils ├── api.js ├── jd.js ├── ql.js └── request.js /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .hbuilderx 3 | .git 4 | .idea 5 | unpackage 6 | package-lock.json -------------------------------------------------------------------------------- /App.vue: -------------------------------------------------------------------------------- 1 | 22 | 23 | 35 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ## 开发准备 2 | 3 | 下载HBuilder X 4 | 5 | ## 安装依赖 6 | 7 | ``` shell 8 | npm install 9 | ``` 10 | 11 | ## 开始开发 12 | 13 | 剩下的就全是纯中文操作啦 14 | 15 | 16 | ***版本会在release更新,请随时关注*** 17 | 18 | -------------------------------------------------------------------------------- /components/Beans/Beans.vue: -------------------------------------------------------------------------------- 1 | 32 | 33 | 136 | 137 | 208 | -------------------------------------------------------------------------------- /components/ql/envs/envs.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | 12 | 13 | 15 | -------------------------------------------------------------------------------- /components/ql/list/list.vue: -------------------------------------------------------------------------------- 1 | 17 | 18 | 131 | 132 | 146 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 12 | 13 | 14 | 15 | 16 | 17 |
18 | 19 | 20 | 21 | -------------------------------------------------------------------------------- /main.js: -------------------------------------------------------------------------------- 1 | import App from './App' 2 | 3 | // #ifndef VUE3 4 | import Vue from 'vue' 5 | Vue.config.productionTip = false 6 | App.mpType = 'app' 7 | import uView from 'uview-ui' 8 | Vue.use(uView) 9 | import store from './store' 10 | const app = new Vue({ 11 | store, 12 | ...App 13 | }) 14 | require('utils/request.js')(app) 15 | app.$mount() 16 | // #endif 17 | 18 | // #ifdef VUE3 19 | import { createSSRApp } from 'vue' 20 | export function createApp() { 21 | const app = createSSRApp(App) 22 | return { 23 | app 24 | } 25 | } 26 | // #endif -------------------------------------------------------------------------------- /manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "name" : "RC-TOOL", 3 | "appid" : "__UNI__EC8D168", 4 | "description" : "", 5 | "versionName" : "1.0.3", 6 | "versionCode" : 103, 7 | "transformPx" : false, 8 | /* 5+App特有相关 */ 9 | "app-plus" : { 10 | "usingComponents" : true, 11 | "nvueStyleCompiler" : "uni-app", 12 | "compilerVersion" : 3, 13 | "splashscreen" : { 14 | "alwaysShowBeforeRender" : true, 15 | "waiting" : true, 16 | "autoclose" : true, 17 | "delay" : 0 18 | }, 19 | /* 模块配置 */ 20 | "modules" : {}, 21 | /* 应用发布信息 */ 22 | "distribute" : { 23 | /* android打包配置 */ 24 | "android" : { 25 | "permissions" : [ 26 | "", 27 | "", 28 | "", 29 | "", 30 | "", 31 | "", 32 | "", 33 | "", 34 | "", 35 | "", 36 | "", 37 | "" 38 | ], 39 | "abiFilters" : [ "armeabi-v7a", "x86" ] 40 | }, 41 | /* ios打包配置 */ 42 | "ios" : {}, 43 | /* SDK配置 */ 44 | "sdkConfigs" : { 45 | "ad" : {} 46 | }, 47 | "icons" : { 48 | "android" : { 49 | "hdpi" : "unpackage/res/icons/72x72.png", 50 | "xhdpi" : "unpackage/res/icons/96x96.png", 51 | "xxhdpi" : "unpackage/res/icons/144x144.png", 52 | "xxxhdpi" : "unpackage/res/icons/192x192.png" 53 | }, 54 | "ios" : { 55 | "appstore" : "unpackage/res/icons/1024x1024.png", 56 | "ipad" : { 57 | "app" : "unpackage/res/icons/76x76.png", 58 | "app@2x" : "unpackage/res/icons/152x152.png", 59 | "notification" : "unpackage/res/icons/20x20.png", 60 | "notification@2x" : "unpackage/res/icons/40x40.png", 61 | "proapp@2x" : "unpackage/res/icons/167x167.png", 62 | "settings" : "unpackage/res/icons/29x29.png", 63 | "settings@2x" : "unpackage/res/icons/58x58.png", 64 | "spotlight" : "unpackage/res/icons/40x40.png", 65 | "spotlight@2x" : "unpackage/res/icons/80x80.png" 66 | }, 67 | "iphone" : { 68 | "app@2x" : "unpackage/res/icons/120x120.png", 69 | "app@3x" : "unpackage/res/icons/180x180.png", 70 | "notification@2x" : "unpackage/res/icons/40x40.png", 71 | "notification@3x" : "unpackage/res/icons/60x60.png", 72 | "settings@2x" : "unpackage/res/icons/58x58.png", 73 | "settings@3x" : "unpackage/res/icons/87x87.png", 74 | "spotlight@2x" : "unpackage/res/icons/80x80.png", 75 | "spotlight@3x" : "unpackage/res/icons/120x120.png" 76 | } 77 | } 78 | }, 79 | "splashscreen" : { 80 | "androidStyle" : "common" 81 | } 82 | }, 83 | "uniStatistics" : { 84 | "enable" : true 85 | } 86 | }, 87 | /* 快应用特有相关 */ 88 | "quickapp" : {}, 89 | /* 小程序特有相关 */ 90 | "mp-weixin" : { 91 | "appid" : "", 92 | "setting" : { 93 | "urlCheck" : false 94 | }, 95 | "usingComponents" : true 96 | }, 97 | "mp-alipay" : { 98 | "usingComponents" : true 99 | }, 100 | "mp-baidu" : { 101 | "usingComponents" : true 102 | }, 103 | "mp-toutiao" : { 104 | "usingComponents" : true 105 | }, 106 | "uniStatistics" : { 107 | "enable" : false 108 | }, 109 | "vueVersion" : "2" 110 | } 111 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "dependencies": { 3 | "highlight.js": "^11.5.1", 4 | "uview-ui": "^2.0.28", 5 | "vuex": "^4.0.2" 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /pages.json: -------------------------------------------------------------------------------- 1 | { 2 | "easycom": { 3 | "^u-(.*)": "uview-ui/components/u-$1/u-$1.vue" 4 | }, 5 | "pages": [ //pages数组中第一项表示应用启动页,参考:https://uniapp.dcloud.io/collocation/pages 6 | { 7 | "path": "pages/jd/jd", 8 | "style": { 9 | "navigationBarTitleText": "京东助手", 10 | "navigationStyle": "custom" 11 | } 12 | }, 13 | { 14 | "path": "pages/ql_panel/ql_panel", 15 | "style": { 16 | "navigationBarTitleText": "", 17 | "enablePullDownRefresh": false, 18 | "navigationStyle": "custom" 19 | } 20 | }, 21 | { 22 | "path": "pages/jd/login/login", 23 | "style": { 24 | "navigationBarTitleText": "获取cookie", 25 | "enablePullDownRefresh": false 26 | } 27 | 28 | }, { 29 | "path": "pages/ql_panel/login/login", 30 | "style": { 31 | "navigationBarTitleText": "青龙面板登录", 32 | "enablePullDownRefresh": false 33 | } 34 | 35 | }, { 36 | "path": "pages/ql_panel/cron_log/cron_log", 37 | "style": { 38 | "navigationBarTitleText": "定时任务执行结果", 39 | "enablePullDownRefresh": false 40 | } 41 | }, { 42 | "path": "pages/ql_panel/env_detail/env_detail", 43 | "style": { 44 | "navigationBarTitleText": "环境变量详情", 45 | "enablePullDownRefresh": false 46 | } 47 | 48 | }, { 49 | "path": "pages/ql_panel/cron_detail/cron_detail", 50 | "style": { 51 | "navigationBarTitleText": "定时任务详情", 52 | "enablePullDownRefresh": false 53 | } 54 | 55 | }, { 56 | "path": "pages/ql_panel/config/config", 57 | "style": { 58 | "navigationBarTitleText": "青龙面板配置文件", 59 | "enablePullDownRefresh": false 60 | } 61 | 62 | }, { 63 | "path": "pages/about/about", 64 | "style": { 65 | "navigationBarTitleText": "关于", 66 | "enablePullDownRefresh": false 67 | } 68 | 69 | } 70 | ,{ 71 | "path" : "pages/jd/setting/setting", 72 | "style" : 73 | { 74 | "navigationBarTitleText": "CK管理", 75 | "enablePullDownRefresh": false 76 | } 77 | 78 | } 79 | ], 80 | "tabBar": { 81 | "color": "#999999", 82 | "selectedColor": "#000000", 83 | "borderStyle": "black", 84 | "backgroundColor": "#FFFFFF", 85 | "iconWidth": "24px", 86 | "list": [{ 87 | "pagePath": "pages/jd/jd", 88 | "iconPath": "static/tabbar/consumption.png", 89 | "selectedIconPath": "static/tabbar/consumption-fill.png", 90 | "text": "京东" 91 | }, 92 | { 93 | "pagePath": "pages/ql_panel/ql_panel", 94 | "iconPath": "static/tabbar/calendar.png", 95 | "selectedIconPath": "static/tabbar/calendar-fill.png", 96 | "text": "青龙" 97 | }, 98 | { 99 | "pagePath": "pages/about/about", 100 | "iconPath": "static/tabbar/account.png", 101 | "selectedIconPath": "static/tabbar/account-fill.png", 102 | "text": "关于" 103 | } 104 | ] 105 | }, 106 | "globalStyle": { 107 | "navigationBarTextStyle": "black", 108 | "navigationBarTitleText": "RC-TOOL", 109 | "navigationBarBackgroundColor": "#F8F8F8", 110 | "backgroundColor": "#F8F8F8" 111 | } 112 | } 113 | -------------------------------------------------------------------------------- /pages/about/about.vue: -------------------------------------------------------------------------------- 1 | 25 | 26 | 80 | 81 | 118 | -------------------------------------------------------------------------------- /pages/jd/jd.vue: -------------------------------------------------------------------------------- 1 | 36 | 37 | 163 | 164 | 180 | -------------------------------------------------------------------------------- /pages/jd/login/login.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 69 | 70 | 73 | -------------------------------------------------------------------------------- /pages/jd/setting/setting.vue: -------------------------------------------------------------------------------- 1 | 14 | 15 | 72 | 73 | 78 | -------------------------------------------------------------------------------- /pages/ql_panel/config/config.vue: -------------------------------------------------------------------------------- 1 | 18 | 19 | 57 | 58 | 80 | -------------------------------------------------------------------------------- /pages/ql_panel/cron_detail/cron_detail.vue: -------------------------------------------------------------------------------- 1 | 36 | 37 | 120 | 121 | 139 | -------------------------------------------------------------------------------- /pages/ql_panel/cron_log/cron_log.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 27 | 28 | 34 | -------------------------------------------------------------------------------- /pages/ql_panel/env_detail/env_detail.vue: -------------------------------------------------------------------------------- 1 | 35 | 36 | 120 | 121 | 138 | -------------------------------------------------------------------------------- /pages/ql_panel/login/login.vue: -------------------------------------------------------------------------------- 1 | 28 | 29 | 112 | 113 | 126 | -------------------------------------------------------------------------------- /pages/ql_panel/ql_panel.vue: -------------------------------------------------------------------------------- 1 | 20 | 21 | 106 | 107 | 123 | -------------------------------------------------------------------------------- /static/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Redcker/RC-TOOL/111e3323a19c726d3644d66871174d900943e756/static/logo.png -------------------------------------------------------------------------------- /static/tabbar/account-fill.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Redcker/RC-TOOL/111e3323a19c726d3644d66871174d900943e756/static/tabbar/account-fill.png -------------------------------------------------------------------------------- /static/tabbar/account.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Redcker/RC-TOOL/111e3323a19c726d3644d66871174d900943e756/static/tabbar/account.png -------------------------------------------------------------------------------- /static/tabbar/calendar-fill.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Redcker/RC-TOOL/111e3323a19c726d3644d66871174d900943e756/static/tabbar/calendar-fill.png -------------------------------------------------------------------------------- /static/tabbar/calendar.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Redcker/RC-TOOL/111e3323a19c726d3644d66871174d900943e756/static/tabbar/calendar.png -------------------------------------------------------------------------------- /static/tabbar/consumption-fill.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Redcker/RC-TOOL/111e3323a19c726d3644d66871174d900943e756/static/tabbar/consumption-fill.png -------------------------------------------------------------------------------- /static/tabbar/consumption.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Redcker/RC-TOOL/111e3323a19c726d3644d66871174d900943e756/static/tabbar/consumption.png -------------------------------------------------------------------------------- /static/tabbar/home-fill.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Redcker/RC-TOOL/111e3323a19c726d3644d66871174d900943e756/static/tabbar/home-fill.png -------------------------------------------------------------------------------- /static/tabbar/home.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Redcker/RC-TOOL/111e3323a19c726d3644d66871174d900943e756/static/tabbar/home.png -------------------------------------------------------------------------------- /store/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import Vuex from 'vuex' 3 | Vue.use(Vuex) 4 | 5 | const store = new Vuex.Store({ 6 | state: { 7 | jdUsers: [], 8 | QLInfo: {}, 9 | jdck: '' 10 | }, 11 | mutations: { 12 | setCK(state, ck) { 13 | state.jdck = ck 14 | }, 15 | setJDUser(state, info) { 16 | state.jdUsers.push(info) 17 | }, 18 | updateQLToken(state, token) { 19 | state.QLInfo.token = token 20 | let info = JSON.parse(uni.getStorageSync('QLInfo')) 21 | info['token'] = token 22 | uni.setStorageSync('QLInfo', JSON.stringify(info)) 23 | }, 24 | setQLInfo(state, info) { 25 | state.QLInfo = info 26 | uni.setStorageSync('QLInfo', JSON.stringify(info)) 27 | }, 28 | setQLServerUrl(state, url) { 29 | state.QLInfo.serverUrl = url 30 | } 31 | }, 32 | actions: {} 33 | }) 34 | export default store 35 | -------------------------------------------------------------------------------- /uni.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * 这里是uni-app内置的常用样式变量 3 | * 4 | * uni-app 官方扩展插件及插件市场(https://ext.dcloud.net.cn)上很多三方插件均使用了这些样式变量 5 | * 如果你是插件开发者,建议你使用scss预处理,并在插件代码中直接使用这些变量(无需 import 这个文件),方便用户通过搭积木的方式开发整体风格一致的App 6 | * 7 | */ 8 | 9 | /** 10 | * 如果你是App开发者(插件使用者),你可以通过修改这些变量来定制自己的插件主题,实现自定义主题功能 11 | * 12 | * 如果你的项目同样使用了scss预处理,你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件 13 | */ 14 | @import 'uview-ui/theme.scss'; 15 | /* 颜色变量 */ 16 | 17 | /* 行为相关颜色 */ 18 | $uni-color-primary: #007aff; 19 | $uni-color-success: #4cd964; 20 | $uni-color-warning: #f0ad4e; 21 | $uni-color-error: #dd524d; 22 | 23 | /* 文字基本颜色 */ 24 | $uni-text-color:#333;//基本色 25 | $uni-text-color-inverse:#fff;//反色 26 | $uni-text-color-grey:#999;//辅助灰色,如加载更多的提示信息 27 | $uni-text-color-placeholder: #808080; 28 | $uni-text-color-disable:#c0c0c0; 29 | 30 | /* 背景颜色 */ 31 | $uni-bg-color:#ffffff; 32 | $uni-bg-color-grey:#f8f8f8; 33 | $uni-bg-color-hover:#f1f1f1;//点击状态颜色 34 | $uni-bg-color-mask:rgba(0, 0, 0, 0.4);//遮罩颜色 35 | 36 | /* 边框颜色 */ 37 | $uni-border-color:#c8c7cc; 38 | 39 | /* 尺寸变量 */ 40 | 41 | /* 文字尺寸 */ 42 | $uni-font-size-sm:12px; 43 | $uni-font-size-base:14px; 44 | $uni-font-size-lg:16; 45 | 46 | /* 图片尺寸 */ 47 | $uni-img-size-sm:20px; 48 | $uni-img-size-base:26px; 49 | $uni-img-size-lg:40px; 50 | 51 | /* Border Radius */ 52 | $uni-border-radius-sm: 2px; 53 | $uni-border-radius-base: 3px; 54 | $uni-border-radius-lg: 6px; 55 | $uni-border-radius-circle: 50%; 56 | 57 | /* 水平间距 */ 58 | $uni-spacing-row-sm: 5px; 59 | $uni-spacing-row-base: 10px; 60 | $uni-spacing-row-lg: 15px; 61 | 62 | /* 垂直间距 */ 63 | $uni-spacing-col-sm: 4px; 64 | $uni-spacing-col-base: 8px; 65 | $uni-spacing-col-lg: 12px; 66 | 67 | /* 透明度 */ 68 | $uni-opacity-disabled: 0.3; // 组件禁用态的透明度 69 | 70 | /* 文章场景相关 */ 71 | $uni-color-title: #2C405A; // 文章标题颜色 72 | $uni-font-size-title:20px; 73 | $uni-color-subtitle: #555555; // 二级标题颜色 74 | $uni-font-size-subtitle:26px; 75 | $uni-color-paragraph: #3F536E; // 文章段落颜色 76 | $uni-font-size-paragraph:15px; 77 | -------------------------------------------------------------------------------- /uni_modules/qiun-data-charts/changelog.md: -------------------------------------------------------------------------------- 1 | ## 2.3.7-20220122(2022-01-22) 2 | ## 重要!使用vue3编译,请使用cli模式并升级至最新依赖,HbuilderX编译需要使用3.3.8以上版本 3 | - uCharts.js 修复uni-app平台组件模式使用vue3编译到小程序报错的bug。 4 | ## 2.3.7-20220118(2022-01-18) 5 | ## 注意,使用vue3的前提是需要3.3.8.20220114-alpha版本的HBuilder! 6 | ## 2.3.67-20220118(2022-01-18) 7 | - 秋云图表组件 组件初步支持vue3,全端编译会有些问题,具体详见下面修改: 8 | 1. 小程序端运行时,在uni_modules文件夹的qiun-data-charts.js中搜索 new uni_modules_qiunDataCharts_js_sdk_uCharts_uCharts.uCharts,将.uCharts去掉。 9 | 2. 小程序端发行时,在uni_modules文件夹的qiun-data-charts.js中搜索 new e.uCharts,将.uCharts去掉,变为 new e。 10 | 3. 如果觉得上述步骤比较麻烦,如果您的项目只编译到小程序端,可以修改u-charts.js最后一行导出方式,将 export default uCharts;变更为 export default { uCharts: uCharts }; 这样变更后,H5和App端的renderjs会有问题,请开发者自行选择。(此问题非组件问题,请等待DC官方修复Vue3的小程序端) 11 | ## 2.3.6-20220111(2022-01-11) 12 | - 秋云图表组件 修改组件 props 属性中的 background 默认值为 rgba(0,0,0,0) 13 | ## 2.3.6-20211201(2021-12-01) 14 | - uCharts.js 修复bar条状图开启圆角模式时,值很小时圆角渲染错误的bug 15 | ## 2.3.5-20211014(2021-10-15) 16 | - uCharts.js 增加vue3的编译支持(仅原生uCharts,qiun-data-charts组件后续会支持,请关注更新) 17 | ## 2.3.4-20211012(2021-10-12) 18 | - 秋云图表组件 修复 mac os x 系统 mouseover 事件丢失的 bug 19 | ## 2.3.3-20210706(2021-07-06) 20 | - uCharts.js 增加雷达图开启数据点值(opts.dataLabel)的显示 21 | ## 2.3.2-20210627(2021-06-27) 22 | - 秋云图表组件 修复tooltipCustom个别情况下传值不正确报错TypeError: Cannot read property 'name' of undefined的bug 23 | ## 2.3.1-20210616(2021-06-16) 24 | - uCharts.js 修复圆角柱状图使用4角圆角时,当数值过大时不正确的bug 25 | ## 2.3.0-20210612(2021-06-12) 26 | - uCharts.js 【重要】uCharts增加nvue兼容,可在nvue项目中使用gcanvas组件渲染uCharts,[详见码云uCharts-demo-nvue](https://gitee.com/uCharts/uCharts) 27 | - 秋云图表组件 增加tapLegend属性,是否开启图例点击交互事件 28 | - 秋云图表组件 getIndex事件中增加返回uCharts实例中的opts参数,以便在页面中调用参数 29 | - 示例项目 pages/other/other.vue增加app端自定义tooltip的方法,详见showOptsTooltip方法 30 | ## 2.2.1-20210603(2021-06-03) 31 | - uCharts.js 修复饼图、圆环图、玫瑰图,当起始角度不为0时,tooltip位置不准确的bug 32 | - uCharts.js 增加温度计式柱状图开启顶部半圆形的配置 33 | ## 2.2.0-20210529(2021-05-29) 34 | - uCharts.js 增加条状图type="bar" 35 | - 示例项目 pages/ucharts/ucharts.vue增加条状图的demo 36 | ## 2.1.7-20210524(2021-05-24) 37 | - uCharts.js 修复大数据量模式下曲线图不平滑的bug 38 | ## 2.1.6-20210523(2021-05-23) 39 | - 秋云图表组件 修复小程序端开启滚动条更新数据后滚动条位置不符合预期的bug 40 | ## 2.1.5-2021051702(2021-05-17) 41 | - uCharts.js 修复自定义Y轴min和max值为0时不能正确显示的bug 42 | ## 2.1.5-20210517(2021-05-17) 43 | - uCharts.js 修复Y轴自定义min和max时,未按指定的最大值最小值显示坐标轴刻度的bug 44 | ## 2.1.4-20210516(2021-05-16) 45 | - 秋云图表组件 优化onWindowResize防抖方法 46 | - 秋云图表组件 修复APP端uCharts更新数据时,清空series显示loading图标后再显示图表,图表抖动的bug 47 | - uCharts.js 修复开启canvas2d后,x轴、y轴、series自定义字体大小未按比例缩放的bug 48 | - 示例项目 修复format-e.vue拼写错误导致app端使用uCharts渲染图表 49 | ## 2.1.3-20210513(2021-05-13) 50 | - 秋云图表组件 修改uCharts变更chartData数据为updateData方法,支持带滚动条的数据动态打点 51 | - 秋云图表组件 增加onWindowResize防抖方法 fix by ど誓言,如尘般染指流年づ 52 | - 秋云图表组件 H5或者APP变更chartData数据显示loading图表时,原数据闪现的bug 53 | - 秋云图表组件 props增加errorReload禁用错误点击重新加载的方法 54 | - uCharts.js 增加tooltip显示category(x轴对应点位)标题的功能,opts.extra.tooltip.showCategory,默认为false 55 | - uCharts.js 修复mix混合图只有柱状图时,tooltip的分割线显示位置不正确的bug 56 | - uCharts.js 修复开启滚动条,图表在拖动中动态打点,滚动条位置不正确的bug 57 | - uCharts.js 修复饼图类数据格式为echarts数据格式,series为空数组报错的bug 58 | - 示例项目 修改uCharts.js更新到v2.1.2版本后,@getIndex方法获取索引值变更为e.currentIndex.index 59 | - 示例项目 pages/updata/updata.vue增加滚动条拖动更新(数据动态打点)的demo 60 | - 示例项目 pages/other/other.vue增加errorReload禁用错误点击重新加载的demo 61 | ## 2.1.2-20210509(2021-05-09) 62 | 秋云图表组件 修复APP端初始化时就传入chartData或lacaldata不显示图表的bug 63 | ## 2.1.1-20210509(2021-05-09) 64 | - 秋云图表组件 变更ECharts的eopts配置在renderjs内执行,支持在config-echarts.js配置文件内写function配置。 65 | - 秋云图表组件 修复APP端报错Prop being mutated: "onmouse"错误的bug。 66 | - 秋云图表组件 修复APP端报错Error: Not Found:Page[6][-1,27] at view.umd.min.js:1的bug。 67 | ## 2.1.0-20210507(2021-05-07) 68 | - 秋云图表组件 修复初始化时就有数据或者数据更新的时候loading加载动画闪动的bug 69 | - uCharts.js 修复x轴format方法categories为字符串类型时返回NaN的bug 70 | - uCharts.js 修复series.textColor、legend.fontColor未执行全局默认颜色的bug 71 | ## 2.1.0-20210506(2021-05-06) 72 | - 秋云图表组件 修复极个别情况下报错item.properties undefined的bug 73 | - 秋云图表组件 修复极个别情况下关闭加载动画reshow不起作用,无法显示图表的bug 74 | - 示例项目 pages/ucharts/ucharts.vue 增加时间轴折线图(type="tline")、时间轴区域图(type="tarea")、散点图(type="scatter")、气泡图demo(type="bubble")、倒三角形漏斗图(opts.extra.funnel.type="triangle")、金字塔形漏斗图(opts.extra.funnel.type="pyramid") 75 | - 示例项目 pages/format-u/format-u.vue 增加X轴format格式化示例 76 | - uCharts.js 升级至v2.1.0版本 77 | - uCharts.js 修复 玫瑰图面积模式点击tooltip位置不正确的bug 78 | - uCharts.js 修复 玫瑰图点击图例,只剩一个类别显示空白的bug 79 | - uCharts.js 修复 饼图类图点击图例,其他图表tooltip位置某些情况下不准的bug 80 | - uCharts.js 修复 x轴为矢量轴(时间轴)情况下,点击tooltip位置不正确的bug 81 | - uCharts.js 修复 词云图获取点击索引偶尔不准的bug 82 | - uCharts.js 增加 直角坐标系图表X轴format格式化方法(原生uCharts.js用法请使用formatter) 83 | - uCharts.js 增加 漏斗图扩展配置,倒三角形(opts.extra.funnel.type="triangle"),金字塔形(opts.extra.funnel.type="pyramid") 84 | - uCharts.js 增加 散点图(opts.type="scatter")、气泡图(opts.type="bubble") 85 | - 后期计划 完善散点图、气泡图,增加markPoints标记点,增加横向条状图。 86 | ## 2.0.0-20210502(2021-05-02) 87 | - uCharts.js 修复词云图获取点击索引不正确的bug 88 | ## 2.0.0-20210501(2021-05-01) 89 | - 秋云图表组件 修复QQ小程序、百度小程序在关闭动画效果情况下,v-for循环使用图表,显示不正确的bug 90 | ## 2.0.0-20210426(2021-04-26) 91 | - 秋云图表组件 修复QQ小程序不支持canvas2d的bug 92 | - 秋云图表组件 修复钉钉小程序某些情况点击坐标计算错误的bug 93 | - uCharts.js 增加 extra.column.categoryGap 参数,柱状图类每个category点位(X轴点)柱子组之间的间距 94 | - uCharts.js 增加 yAxis.data[i].titleOffsetY 参数,标题纵向偏移距离,负数为向上偏移,正数向下偏移 95 | - uCharts.js 增加 yAxis.data[i].titleOffsetX 参数,标题横向偏移距离,负数为向左偏移,正数向右偏移 96 | - uCharts.js 增加 extra.gauge.labelOffset 参数,仪表盘标签文字径向便宜距离,默认13px 97 | ## 2.0.0-20210422-2(2021-04-22) 98 | 秋云图表组件 修复 formatterAssign 未判断 args[key] == null 的情况导致栈溢出的 bug 99 | ## 2.0.0-20210422(2021-04-22) 100 | - 秋云图表组件 修复H5、APP、支付宝小程序、微信小程序canvas2d模式下横屏模式的bug 101 | ## 2.0.0-20210421(2021-04-21) 102 | - uCharts.js 修复多行图例的情况下,图例在上方或者下方时,图例float为左侧或者右侧时,第二行及以后的图例对齐方式不正确的bug 103 | ## 2.0.0-20210420(2021-04-20) 104 | - 秋云图表组件 修复微信小程序开启canvas2d模式后,windows版微信小程序不支持canvas2d模式的bug 105 | - 秋云图表组件 修改非uni_modules版本为v2.0版本qiun-data-charts组件 106 | ## 2.0.0-20210419(2021-04-19) 107 | ## v1.0版本已停更,建议转uni_modules版本组件方式调用,点击右侧绿色【使用HBuilderX导入插件】即可使用,示例项目请点击右侧蓝色按钮【使用HBuilderX导入示例项目】。 108 | ## 初次使用如果提示未注册<qiun-data-charts>组件,请重启HBuilderX,如仍不好用,请重启电脑; 109 | ## 如果是cli项目,请尝试清理node_modules,重新install,还不行就删除项目,再重新install。 110 | ## 此问题已于DCloud官方确认,HBuilderX下个版本会修复。 111 | ## 其他图表不显示问题详见[常见问题选项卡](https://demo.ucharts.cn) 112 | ## 新手请先完整阅读帮助文档及常见问题3遍,右侧蓝色按钮示例项目请看2遍! 113 | ## [DEMO演示及在线生成工具(v2.0文档)https://demo.ucharts.cn](https://demo.ucharts.cn) 114 | ## [图表组件在项目中的应用参见 UReport数据报表](https://ext.dcloud.net.cn/plugin?id=4651) 115 | - uCharts.js 修复混合图中柱状图单独设置颜色不生效的bug 116 | - uCharts.js 修复多Y轴单独设置fontSize时,开启canvas2d后,未对应放大字体的bug 117 | ## 2.0.0-20210418(2021-04-18) 118 | - 秋云图表组件 增加directory配置,修复H5端history模式下如果发布到二级目录无法正确加载echarts.min.js的bug 119 | ## 2.0.0-20210416(2021-04-16) 120 | ## v1.0版本已停更,建议转uni_modules版本组件方式调用,点击右侧绿色【使用HBuilderX导入插件】即可使用,示例项目请点击右侧蓝色按钮【使用HBuilderX导入示例项目】。 121 | ## 初次使用如果提示未注册<qiun-data-charts>组件,请重启HBuilderX,如仍不好用,请重启电脑; 122 | ## 如果是cli项目,请尝试清理node_modules,重新install,还不行就删除项目,再重新install。 123 | ## 此问题已于DCloud官方确认,HBuilderX下个版本会修复。 124 | ## 其他图表不显示问题详见[常见问题选项卡](https://demo.ucharts.cn) 125 | ## 新手请先完整阅读帮助文档及常见问题3遍,右侧蓝色按钮示例项目请看2遍! 126 | ## [DEMO演示及在线生成工具(v2.0文档)https://demo.ucharts.cn](https://demo.ucharts.cn) 127 | ## [图表组件在项目中的应用参见 UReport数据报表](https://ext.dcloud.net.cn/plugin?id=4651) 128 | - 秋云图表组件 修复APP端某些情况下报错`Not Found Page`的bug,fix by 高级bug开发技术员 129 | - 示例项目 修复APP端v-for循环某些情况下报错`Not Found Page`的bug,fix by 高级bug开发技术员 130 | - uCharts.js 修复非直角坐标系tooltip提示窗右侧超出未变换方向显示的bug 131 | ## 2.0.0-20210415(2021-04-15) 132 | - 秋云图表组件 修复H5端发布到二级目录下echarts无法加载的bug 133 | - 秋云图表组件 修复某些情况下echarts.off('finished')移除监听事件报错的bug 134 | ## 2.0.0-20210414(2021-04-14) 135 | ## v1.0版本已停更,建议转uni_modules版本组件方式调用,点击右侧绿色【使用HBuilderX导入插件】即可使用,示例项目请点击右侧蓝色按钮【使用HBuilderX导入示例项目】。 136 | ## 初次使用如果提示未注册<qiun-data-charts>组件,请重启HBuilderX,如仍不好用,请重启电脑; 137 | ## 如果是cli项目,请尝试清理node_modules,重新install,还不行就删除项目,再重新install。 138 | ## 此问题已于DCloud官方确认,HBuilderX下个版本会修复。 139 | ## 其他图表不显示问题详见[常见问题选项卡](https://demo.ucharts.cn) 140 | ## 新手请先完整阅读帮助文档及常见问题3遍,右侧蓝色按钮示例项目请看2遍! 141 | ## [DEMO演示及在线生成工具(v2.0文档)https://demo.ucharts.cn](https://demo.ucharts.cn) 142 | ## [图表组件在项目中的应用参见 UReport数据报表](https://ext.dcloud.net.cn/plugin?id=4651) 143 | - 秋云图表组件 修复H5端在cli项目下ECharts引用地址错误的bug 144 | - 示例项目 增加ECharts的formatter用法的示例(详见示例项目format-e.vue) 145 | - uCharts.js 增加圆环图中心背景色的配置extra.ring.centerColor 146 | - uCharts.js 修复微信小程序安卓端柱状图开启透明色后显示不正确的bug 147 | ## 2.0.0-20210413(2021-04-13) 148 | - 秋云图表组件 修复百度小程序多个图表真机未能正确获取根元素dom尺寸的bug 149 | - 秋云图表组件 修复百度小程序横屏模式方向不正确的bug 150 | - 秋云图表组件 修改ontouch时,@getTouchStart@getTouchMove@getTouchEnd的触发条件 151 | - uCharts.js 修复饼图类数据格式series属性不生效的bug 152 | - uCharts.js 增加时序区域图 详见示例项目中ucharts.vue 153 | ## 2.0.0-20210412-2(2021-04-12) 154 | ## v1.0版本已停更,建议转uni_modules版本组件方式调用,点击右侧绿色【使用HBuilderX导入插件】即可使用,示例项目请点击右侧蓝色按钮【使用HBuilderX导入示例项目】。 155 | ## 初次使用如果提示未注册<qiun-data-charts>组件,请重启HBuilderX。如仍不好用,请重启电脑,此问题已于DCloud官方确认,HBuilderX下个版本会修复。 156 | ## [DEMO演示及在线生成工具(v2.0文档)https://demo.ucharts.cn](https://demo.ucharts.cn) 157 | ## [图表组件在uniCloudAdmin中的应用 UReport数据报表](https://ext.dcloud.net.cn/plugin?id=4651) 158 | - 秋云图表组件 修复uCharts在APP端横屏模式下不能正确渲染的bug 159 | - 示例项目 增加ECharts柱状图渐变色、圆角柱状图、横向柱状图(条状图)的示例 160 | ## 2.0.0-20210412(2021-04-12) 161 | - 秋云图表组件 修复created中判断echarts导致APP端无法识别,改回mounted中判断echarts初始化 162 | - uCharts.js 修复2d模式下series.textOffset未乘像素比的bug 163 | ## 2.0.0-20210411(2021-04-11) 164 | ## v1.0版本已停更,建议转uni_modules版本组件方式调用,点击右侧绿色【使用HBuilderX导入插件】即可使用,示例项目请点击右侧蓝色按钮【使用HBuilderX导入示例项目】。 165 | ## 初次使用如果提示未注册组件,请重启HBuilderX,并清空小程序开发者工具缓存。 166 | ## [DEMO演示及在线生成工具(v2.0文档)https://demo.ucharts.cn](https://demo.ucharts.cn) 167 | ## [图表组件在uniCloudAdmin中的应用 UReport数据报表](https://ext.dcloud.net.cn/plugin?id=4651) 168 | - uCharts.js 折线图区域图增加connectNulls断点续连的功能,详见示例项目中ucharts.vue 169 | - 秋云图表组件 变更初始化方法为created,变更type2d默认值为true,优化2d模式下组件初始化后dom获取不到的bug 170 | - 秋云图表组件 修复左右布局时,右侧图表点击坐标错误的bug,修复tooltip柱状图自定义颜色显示object的bug 171 | ## 2.0.0-20210410(2021-04-10) 172 | - 修复左右布局时,右侧图表点击坐标错误的bug,修复柱状图自定义颜色tooltip显示object的bug 173 | - 增加标记线及柱状图自定义颜色的demo 174 | ## 2.0.0-20210409(2021-04-08) 175 | ## v1.0版本已停更,建议转uni_modules版本组件方式调用,点击右侧【使用HBuilderX导入插件】即可体验,DEMO演示及在线生成工具(v2.0文档)[https://demo.ucharts.cn](https://demo.ucharts.cn) 176 | ## 图表组件在uniCloudAdmin中的应用 [UReport数据报表](https://ext.dcloud.net.cn/plugin?id=4651) 177 | - uCharts.js 修复钉钉小程序百度小程序measureText不准确的bug,修复2d模式下饼图类activeRadius为按比例放大的bug 178 | - 修复组件在支付宝小程序端点击位置不准确的bug 179 | ## 2.0.0-20210408(2021-04-07) 180 | - 修复组件在支付宝小程序端不能显示的bug(目前支付宝小程不能点击交互,后续修复) 181 | - uCharts.js 修复高分屏下柱状图类,圆弧进度条 自定义宽度不能按比例放大的bug 182 | ## 2.0.0-20210407(2021-04-06) 183 | ## v1.0版本已停更,建议转uni_modules版本组件方式调用,点击右侧【使用HBuilderX导入插件】即可体验,DEMO演示及在线生成工具(v2.0文档)[https://demo.ucharts.cn](https://demo.ucharts.cn) 184 | ## 增加 通过tofix和unit快速格式化y轴的demo add by `howcode` 185 | ## 增加 图表组件在uniCloudAdmin中的应用 [UReport数据报表](https://ext.dcloud.net.cn/plugin?id=4651) 186 | ## 2.0.0-20210406(2021-04-05) 187 | # 秋云图表组件+uCharts v2.0版本同步上线,使用方法详见https://demo.ucharts.cn帮助页 188 | ## 2.0.0(2021-04-05) 189 | # 秋云图表组件+uCharts v2.0版本同步上线,使用方法详见https://demo.ucharts.cn帮助页 190 | -------------------------------------------------------------------------------- /uni_modules/qiun-data-charts/components/qiun-error/qiun-error.vue: -------------------------------------------------------------------------------- 1 | 7 | 8 | 24 | 25 | 47 | -------------------------------------------------------------------------------- /uni_modules/qiun-data-charts/components/qiun-loading/loading1.vue: -------------------------------------------------------------------------------- 1 | 9 | 10 | 20 | 21 | 163 | -------------------------------------------------------------------------------- /uni_modules/qiun-data-charts/components/qiun-loading/loading2.vue: -------------------------------------------------------------------------------- 1 | 9 | 10 | 20 | 21 | 171 | -------------------------------------------------------------------------------- /uni_modules/qiun-data-charts/components/qiun-loading/loading3.vue: -------------------------------------------------------------------------------- 1 | 9 | 10 | 20 | 21 | 174 | -------------------------------------------------------------------------------- /uni_modules/qiun-data-charts/components/qiun-loading/loading4.vue: -------------------------------------------------------------------------------- 1 | 9 | 10 | 20 | 21 | 223 | -------------------------------------------------------------------------------- /uni_modules/qiun-data-charts/components/qiun-loading/loading5.vue: -------------------------------------------------------------------------------- 1 | 9 | 10 | 20 | 230 | -------------------------------------------------------------------------------- /uni_modules/qiun-data-charts/components/qiun-loading/qiun-loading.vue: -------------------------------------------------------------------------------- 1 | 10 | 11 | 33 | 34 | 37 | -------------------------------------------------------------------------------- /uni_modules/qiun-data-charts/js_sdk/u-charts/config-echarts.js: -------------------------------------------------------------------------------- 1 | /* 2 | * uCharts® 3 | * 高性能跨平台图表库,支持H5、APP、小程序(微信/支付宝/百度/头条/QQ/360)、Vue、Taro等支持canvas的框架平台 4 | * Copyright (c) 2021 QIUN®秋云 https://www.ucharts.cn All rights reserved. 5 | * Licensed ( http://www.apache.org/licenses/LICENSE-2.0 ) 6 | * 复制使用请保留本段注释,感谢支持开源! 7 | * 8 | * uCharts®官方网站 9 | * https://www.uCharts.cn 10 | * 11 | * 开源地址: 12 | * https://gitee.com/uCharts/uCharts 13 | * 14 | * uni-app插件市场地址: 15 | * http://ext.dcloud.net.cn/plugin?id=271 16 | * 17 | */ 18 | 19 | // 通用配置项 20 | 21 | // 主题颜色配置:如每个图表类型需要不同主题,请在对应图表类型上更改color属性 22 | const color = ['#1890FF', '#91CB74', '#FAC858', '#EE6666', '#73C0DE', '#3CA272', '#FC8452', '#9A60B4', '#ea7ccc']; 23 | 24 | const cfe = { 25 | //demotype为自定义图表类型 26 | "type": ["pie", "ring", "rose", "funnel", "line", "column", "area", "radar", "gauge","candle","demotype"], 27 | //增加自定义图表类型,如果需要categories,请在这里加入您的图表类型例如最后的"demotype" 28 | "categories": ["line", "column", "area", "radar", "gauge", "candle","demotype"], 29 | //instance为实例变量承载属性,option为eopts承载属性,不要删除 30 | "instance": {}, 31 | "option": {}, 32 | //下面是自定义format配置,因除H5端外的其他端无法通过props传递函数,只能通过此属性对应下标的方式来替换 33 | "formatter":{ 34 | "tooltipDemo1":function(res){ 35 | let result = '' 36 | for (let i in res) { 37 | if (i == 0) { 38 | result += res[i].axisValueLabel + '年销售额' 39 | } 40 | let value = '--' 41 | if (res[i].data !== null) { 42 | value = res[i].data 43 | } 44 | // #ifdef H5 45 | result += '\n' + res[i].seriesName + ':' + value + ' 万元' 46 | // #endif 47 | 48 | // #ifdef APP-PLUS 49 | result += '
' + res[i].marker + res[i].seriesName + ':' + value + ' 万元' 50 | // #endif 51 | } 52 | return result; 53 | }, 54 | legendFormat:function(name){ 55 | return "自定义图例+"+name; 56 | }, 57 | yAxisFormatDemo:function (value, index) { 58 | return value + '元'; 59 | }, 60 | seriesFormatDemo:function(res){ 61 | return res.name + '年' + res.value + '元'; 62 | } 63 | }, 64 | //这里演示了自定义您的图表类型的option,可以随意命名,之后在组件上 type="demotype" 后,组件会调用这个花括号里的option,如果组件上还存在eopts参数,会将demotype与eopts中option合并后渲染图表。 65 | "demotype":{ 66 | "color": color, 67 | //在这里填写echarts的option即可 68 | 69 | }, 70 | //下面是自定义配置,请添加项目所需的通用配置 71 | "column": { 72 | "color": color, 73 | "title": { 74 | "text": '' 75 | }, 76 | "tooltip": { 77 | "trigger": 'axis' 78 | }, 79 | "grid": { 80 | "top": 30, 81 | "bottom": 50, 82 | "right": 15, 83 | "left": 40 84 | }, 85 | "legend": { 86 | "bottom": 'left', 87 | }, 88 | "toolbox": { 89 | "show": false, 90 | }, 91 | "xAxis": { 92 | "type": 'category', 93 | "axisLabel": { 94 | "color": '#666666' 95 | }, 96 | "axisLine": { 97 | "lineStyle": { 98 | "color": '#CCCCCC' 99 | } 100 | }, 101 | "boundaryGap": true, 102 | "data": [] 103 | }, 104 | "yAxis": { 105 | "type": 'value', 106 | "axisTick": { 107 | "show": false, 108 | }, 109 | "axisLabel": { 110 | "color": '#666666' 111 | }, 112 | "axisLine": { 113 | "lineStyle": { 114 | "color": '#CCCCCC' 115 | } 116 | }, 117 | }, 118 | "seriesTemplate": { 119 | "name": '', 120 | "type": 'bar', 121 | "data": [], 122 | "barwidth": 20, 123 | "label": { 124 | "show": true, 125 | "color": "#666666", 126 | "position": 'top', 127 | }, 128 | }, 129 | }, 130 | "line": { 131 | "color": color, 132 | "title": { 133 | "text": '' 134 | }, 135 | "tooltip": { 136 | "trigger": 'axis' 137 | }, 138 | "grid": { 139 | "top": 30, 140 | "bottom": 50, 141 | "right": 15, 142 | "left": 40 143 | }, 144 | "legend": { 145 | "bottom": 'left', 146 | }, 147 | "toolbox": { 148 | "show": false, 149 | }, 150 | "xAxis": { 151 | "type": 'category', 152 | "axisLabel": { 153 | "color": '#666666' 154 | }, 155 | "axisLine": { 156 | "lineStyle": { 157 | "color": '#CCCCCC' 158 | } 159 | }, 160 | "boundaryGap": true, 161 | "data": [] 162 | }, 163 | "yAxis": { 164 | "type": 'value', 165 | "axisTick": { 166 | "show": false, 167 | }, 168 | "axisLabel": { 169 | "color": '#666666' 170 | }, 171 | "axisLine": { 172 | "lineStyle": { 173 | "color": '#CCCCCC' 174 | } 175 | }, 176 | }, 177 | "seriesTemplate": { 178 | "name": '', 179 | "type": 'line', 180 | "data": [], 181 | "barwidth": 20, 182 | "label": { 183 | "show": true, 184 | "color": "#666666", 185 | "position": 'top', 186 | }, 187 | }, 188 | }, 189 | "area": { 190 | "color": color, 191 | "title": { 192 | "text": '' 193 | }, 194 | "tooltip": { 195 | "trigger": 'axis' 196 | }, 197 | "grid": { 198 | "top": 30, 199 | "bottom": 50, 200 | "right": 15, 201 | "left": 40 202 | }, 203 | "legend": { 204 | "bottom": 'left', 205 | }, 206 | "toolbox": { 207 | "show": false, 208 | }, 209 | "xAxis": { 210 | "type": 'category', 211 | "axisLabel": { 212 | "color": '#666666' 213 | }, 214 | "axisLine": { 215 | "lineStyle": { 216 | "color": '#CCCCCC' 217 | } 218 | }, 219 | "boundaryGap": true, 220 | "data": [] 221 | }, 222 | "yAxis": { 223 | "type": 'value', 224 | "axisTick": { 225 | "show": false, 226 | }, 227 | "axisLabel": { 228 | "color": '#666666' 229 | }, 230 | "axisLine": { 231 | "lineStyle": { 232 | "color": '#CCCCCC' 233 | } 234 | }, 235 | }, 236 | "seriesTemplate": { 237 | "name": '', 238 | "type": 'line', 239 | "data": [], 240 | "areaStyle": {}, 241 | "label": { 242 | "show": true, 243 | "color": "#666666", 244 | "position": 'top', 245 | }, 246 | }, 247 | }, 248 | "pie": { 249 | "color": color, 250 | "title": { 251 | "text": '' 252 | }, 253 | "tooltip": { 254 | "trigger": 'item' 255 | }, 256 | "grid": { 257 | "top": 40, 258 | "bottom": 30, 259 | "right": 15, 260 | "left": 15 261 | }, 262 | "legend": { 263 | "bottom": 'left', 264 | }, 265 | "seriesTemplate": { 266 | "name": '', 267 | "type": 'pie', 268 | "data": [], 269 | "radius": '50%', 270 | "label": { 271 | "show": true, 272 | "color": "#666666", 273 | "position": 'top', 274 | }, 275 | }, 276 | }, 277 | "ring": { 278 | "color": color, 279 | "title": { 280 | "text": '' 281 | }, 282 | "tooltip": { 283 | "trigger": 'item' 284 | }, 285 | "grid": { 286 | "top": 40, 287 | "bottom": 30, 288 | "right": 15, 289 | "left": 15 290 | }, 291 | "legend": { 292 | "bottom": 'left', 293 | }, 294 | "seriesTemplate": { 295 | "name": '', 296 | "type": 'pie', 297 | "data": [], 298 | "radius": ['40%', '70%'], 299 | "avoidLabelOverlap": false, 300 | "label": { 301 | "show": true, 302 | "color": "#666666", 303 | "position": 'top', 304 | }, 305 | "labelLine": { 306 | "show": true 307 | }, 308 | }, 309 | }, 310 | "rose": { 311 | "color": color, 312 | "title": { 313 | "text": '' 314 | }, 315 | "tooltip": { 316 | "trigger": 'item' 317 | }, 318 | "legend": { 319 | "top": 'bottom' 320 | }, 321 | "seriesTemplate": { 322 | "name": '', 323 | "type": 'pie', 324 | "data": [], 325 | "radius": "55%", 326 | "center": ['50%', '50%'], 327 | "rosetype": 'area', 328 | }, 329 | }, 330 | "funnel": { 331 | "color": color, 332 | "title": { 333 | "text": '' 334 | }, 335 | "tooltip": { 336 | "trigger": 'item', 337 | "formatter": "{b} : {c}%" 338 | }, 339 | "legend": { 340 | "top": 'bottom' 341 | }, 342 | "seriesTemplate": { 343 | "name": '', 344 | "type": 'funnel', 345 | "left": '10%', 346 | "top": 60, 347 | "bottom": 60, 348 | "width": '80%', 349 | "min": 0, 350 | "max": 100, 351 | "minSize": '0%', 352 | "maxSize": '100%', 353 | "sort": 'descending', 354 | "gap": 2, 355 | "label": { 356 | "show": true, 357 | "position": 'inside' 358 | }, 359 | "labelLine": { 360 | "length": 10, 361 | "lineStyle": { 362 | "width": 1, 363 | "type": 'solid' 364 | } 365 | }, 366 | "itemStyle": { 367 | "bordercolor": '#fff', 368 | "borderwidth": 1 369 | }, 370 | "emphasis": { 371 | "label": { 372 | "fontSize": 20 373 | } 374 | }, 375 | "data": [], 376 | }, 377 | }, 378 | "gauge": { 379 | "color": color, 380 | "tooltip": { 381 | "formatter": '{a}
{b} : {c}%' 382 | }, 383 | "seriesTemplate": { 384 | "name": '业务指标', 385 | "type": 'gauge', 386 | "detail": {"formatter": '{value}%'}, 387 | "data": [{"value": 50, "name": '完成率'}] 388 | }, 389 | }, 390 | "candle": { 391 | "xAxis": { 392 | "data": [] 393 | }, 394 | "yAxis": {}, 395 | "color": color, 396 | "title": { 397 | "text": '' 398 | }, 399 | "dataZoom": [{ 400 | "type": 'inside', 401 | "xAxisIndex": [0, 1], 402 | "start": 10, 403 | "end": 100 404 | }, 405 | { 406 | "show": true, 407 | "xAxisIndex": [0, 1], 408 | "type": 'slider', 409 | "bottom": 10, 410 | "start": 10, 411 | "end": 100 412 | } 413 | ], 414 | "seriesTemplate": { 415 | "name": '', 416 | "type": 'k', 417 | "data": [], 418 | }, 419 | } 420 | } 421 | 422 | export default cfe; -------------------------------------------------------------------------------- /uni_modules/qiun-data-charts/js_sdk/u-charts/config-ucharts.js: -------------------------------------------------------------------------------- 1 | /* 2 | * uCharts® 3 | * 高性能跨平台图表库,支持H5、APP、小程序(微信/支付宝/百度/头条/QQ/360)、Vue、Taro等支持canvas的框架平台 4 | * Copyright (c) 2021 QIUN®秋云 https://www.ucharts.cn All rights reserved. 5 | * Licensed ( http://www.apache.org/licenses/LICENSE-2.0 ) 6 | * 复制使用请保留本段注释,感谢支持开源! 7 | * 8 | * uCharts®官方网站 9 | * https://www.uCharts.cn 10 | * 11 | * 开源地址: 12 | * https://gitee.com/uCharts/uCharts 13 | * 14 | * uni-app插件市场地址: 15 | * http://ext.dcloud.net.cn/plugin?id=271 16 | * 17 | */ 18 | 19 | // 主题颜色配置:如每个图表类型需要不同主题,请在对应图表类型上更改color属性 20 | const color = ['#1890FF', '#91CB74', '#FAC858', '#EE6666', '#73C0DE', '#3CA272', '#FC8452', '#9A60B4', '#ea7ccc']; 21 | 22 | //事件转换函数,主要用作格式化x轴为时间轴,根据需求自行修改 23 | const formatDateTime = (timeStamp, returnType)=>{ 24 | var date = new Date(); 25 | date.setTime(timeStamp * 1000); 26 | var y = date.getFullYear(); 27 | var m = date.getMonth() + 1; 28 | m = m < 10 ? ('0' + m) : m; 29 | var d = date.getDate(); 30 | d = d < 10 ? ('0' + d) : d; 31 | var h = date.getHours(); 32 | h = h < 10 ? ('0' + h) : h; 33 | var minute = date.getMinutes(); 34 | var second = date.getSeconds(); 35 | minute = minute < 10 ? ('0' + minute) : minute; 36 | second = second < 10 ? ('0' + second) : second; 37 | if(returnType == 'full'){return y + '-' + m + '-' + d + ' '+ h +':' + minute + ':' + second;} 38 | if(returnType == 'y-m-d'){return y + '-' + m + '-' + d;} 39 | if(returnType == 'h:m'){return h +':' + minute;} 40 | if(returnType == 'h:m:s'){return h +':' + minute +':' + second;} 41 | return [y, m, d, h, minute, second]; 42 | } 43 | 44 | const cfu = { 45 | //demotype为自定义图表类型,一般不需要自定义图表类型,只需要改根节点上对应的类型即可 46 | "type":["pie","ring","rose","word","funnel","map","arcbar","line","column","bar","area","radar","gauge","candle","mix","tline","tarea","scatter","bubble","demotype"], 47 | "range":["饼状图","圆环图","玫瑰图","词云图","漏斗图","地图","圆弧进度条","折线图","柱状图","条状图","区域图","雷达图","仪表盘","K线图","混合图","时间轴折线","时间轴区域","散点图","气泡图","自定义类型"], 48 | //增加自定义图表类型,如果需要categories,请在这里加入您的图表类型,例如最后的"demotype" 49 | //自定义类型时需要注意"tline","tarea","scatter","bubble"等时间轴(矢量x轴)类图表,没有categories,不需要加入categories 50 | "categories":["line","column","bar","area","radar","gauge","candle","mix","demotype"], 51 | //instance为实例变量承载属性,不要删除 52 | "instance":{}, 53 | //option为opts及eopts承载属性,不要删除 54 | "option":{}, 55 | //下面是自定义format配置,因除H5端外的其他端无法通过props传递函数,只能通过此属性对应下标的方式来替换 56 | "formatter":{ 57 | "yAxisDemo1":function(val){return val+'元'}, 58 | "yAxisDemo2":function(val){return val.toFixed(2)}, 59 | "xAxisDemo1":function(val){return val+'年'}, 60 | "xAxisDemo2":function(val){return formatDateTime(val,'h:m')}, 61 | "seriesDemo1":function(val){return val+'元'}, 62 | "tooltipDemo1":function(item, category, index, opts){ 63 | if(index==0){ 64 | return '随便用'+item.data+'年' 65 | }else{ 66 | return '其他我没改'+item.data+'天' 67 | } 68 | }, 69 | "pieDemo":function(val, index, series){ 70 | if(index !== undefined){ 71 | return series[index].name+':'+series[index].data+'元' 72 | } 73 | }, 74 | }, 75 | //这里演示了自定义您的图表类型的option,可以随意命名,之后在组件上 type="demotype" 后,组件会调用这个花括号里的option,如果组件上还存在opts参数,会将demotype与opts中option合并后渲染图表。 76 | "demotype":{ 77 | //我这里把曲线图当做了自定义图表类型,您可以根据需要随意指定类型或配置 78 | "type": "line", 79 | "color": color, 80 | "padding": [15,10,0,15], 81 | "xAxis": { 82 | "disableGrid": true, 83 | }, 84 | "yAxis": { 85 | "gridType": "dash", 86 | "dashLength": 2, 87 | }, 88 | "legend": { 89 | }, 90 | "extra": { 91 | "line": { 92 | "type": "curve", 93 | "width": 2 94 | }, 95 | } 96 | }, 97 | //下面是自定义配置,请添加项目所需的通用配置 98 | "pie":{ 99 | "type": "pie", 100 | "color": color, 101 | "padding": [5,5,5,5], 102 | "extra": { 103 | "pie": { 104 | "activeOpacity": 0.5, 105 | "activeRadius": 10, 106 | "offsetAngle": 0, 107 | "labelWidth": 15, 108 | "border": true, 109 | "borderWidth": 3, 110 | "borderColor": "#FFFFFF" 111 | }, 112 | } 113 | }, 114 | "ring":{ 115 | "type": "ring", 116 | "color": color, 117 | "padding": [5,5,5,5], 118 | "rotate": false, 119 | "dataLabel": true, 120 | "legend": { 121 | "show": true, 122 | "position": "right", 123 | "lineHeight": 25, 124 | }, 125 | "title": { 126 | "name": "收益率", 127 | "fontSize": 15, 128 | "color": "#666666" 129 | }, 130 | "subtitle": { 131 | "name": "70%", 132 | "fontSize": 25, 133 | "color": "#7cb5ec" 134 | }, 135 | "extra": { 136 | "ring": { 137 | "ringWidth":30, 138 | "activeOpacity": 0.5, 139 | "activeRadius": 10, 140 | "offsetAngle": 0, 141 | "labelWidth": 15, 142 | "border": true, 143 | "borderWidth": 3, 144 | "borderColor": "#FFFFFF" 145 | }, 146 | }, 147 | }, 148 | "rose":{ 149 | "type": "rose", 150 | "color": color, 151 | "padding": [5,5,5,5], 152 | "legend": { 153 | "show": true, 154 | "position": "left", 155 | "lineHeight": 25, 156 | }, 157 | "extra": { 158 | "rose": { 159 | "type": "area", 160 | "minRadius": 50, 161 | "activeOpacity": 0.5, 162 | "activeRadius": 10, 163 | "offsetAngle": 0, 164 | "labelWidth": 15, 165 | "border": false, 166 | "borderWidth": 2, 167 | "borderColor": "#FFFFFF" 168 | }, 169 | } 170 | }, 171 | "word":{ 172 | "type": "word", 173 | "color": color, 174 | "extra": { 175 | "word": { 176 | "type": "normal", 177 | "autoColors": false 178 | } 179 | } 180 | }, 181 | "funnel":{ 182 | "type": "funnel", 183 | "color": color, 184 | "padding": [15,15,0,15], 185 | "extra": { 186 | "funnel": { 187 | "activeOpacity": 0.3, 188 | "activeWidth": 10, 189 | "border": true, 190 | "borderWidth": 2, 191 | "borderColor": "#FFFFFF", 192 | "fillOpacity": 1, 193 | "labelAlign": "right" 194 | }, 195 | } 196 | }, 197 | "map":{ 198 | "type": "map", 199 | "color": color, 200 | "padding": [0,0,0,0], 201 | "dataLabel": true, 202 | "extra": { 203 | "map": { 204 | "border": true, 205 | "borderWidth": 1, 206 | "borderColor": "#666666", 207 | "fillOpacity": 0.6, 208 | "activeBorderColor": "#F04864", 209 | "activeFillColor": "#FACC14", 210 | "activeFillOpacity": 1 211 | }, 212 | } 213 | }, 214 | "arcbar":{ 215 | "type": "arcbar", 216 | "color": color, 217 | "title": { 218 | "name": "百分比", 219 | "fontSize": 25, 220 | "color": "#00FF00" 221 | }, 222 | "subtitle": { 223 | "name": "默认标题", 224 | "fontSize": 15, 225 | "color": "#666666" 226 | }, 227 | "extra": { 228 | "arcbar": { 229 | "type": "default", 230 | "width": 12, 231 | "backgroundColor": "#E9E9E9", 232 | "startAngle": 0.75, 233 | "endAngle": 0.25, 234 | "gap": 2 235 | } 236 | } 237 | }, 238 | "line":{ 239 | "type": "line", 240 | "canvasId": "", 241 | "canvas2d": false, 242 | "background": "none", 243 | "animation": true, 244 | "timing": "easeOut", 245 | "duration": 1000, 246 | "color": [ 247 | "#1890FF", 248 | "#91CB74", 249 | "#FAC858", 250 | "#EE6666", 251 | "#73C0DE", 252 | "#3CA272", 253 | "#FC8452", 254 | "#9A60B4", 255 | "#ea7ccc" 256 | ], 257 | "padding": [ 258 | 15, 259 | 10, 260 | 15, 261 | 10 262 | ], 263 | "rotate": false, 264 | "errorReload": true, 265 | "fontSize": 13, 266 | "fontColor": "#666666", 267 | "enableScroll": false, 268 | "touchMoveLimit": 60, 269 | "enableMarkLine": false, 270 | "dataLabel": true, 271 | "dataPointShape": true, 272 | "dataPointShapeType": "solid", 273 | "tapLegend": true, 274 | "xAxis": { 275 | "disabled": false, 276 | "axisLine": true, 277 | "axisLineColor": "#CCCCCC", 278 | "calibration": false, 279 | "fontColor": "#666666", 280 | "fontSize": 13, 281 | "rotateLabel": false, 282 | "itemCount": 5, 283 | "boundaryGap": "center", 284 | "disableGrid": true, 285 | "gridColor": "#CCCCCC", 286 | "gridType": "solid", 287 | "dashLength": 4, 288 | "gridEval": 1, 289 | "scrollShow": false, 290 | "scrollAlign": "left", 291 | "scrollColor": "#A6A6A6", 292 | "scrollBackgroundColor": "#EFEBEF", 293 | "format": "" 294 | }, 295 | "yAxis": { 296 | "disabled": true, 297 | "disableGrid": false, 298 | "splitNumber": 5, 299 | "gridType": "dash", 300 | "dashLength": 2, 301 | "gridColor": "#CCCCCC", 302 | "padding": 10, 303 | "showTitle": false, 304 | "data": [] 305 | }, 306 | "legend": { 307 | "show": false, 308 | "position": "bottom", 309 | "float": "center", 310 | "padding": 5, 311 | "margin": 5, 312 | "backgroundColor": "rgba(0,0,0,0)", 313 | "borderColor": "rgba(0,0,0,0)", 314 | "borderWidth": 0, 315 | "fontSize": 13, 316 | "fontColor": "#666666", 317 | "lineHeight": 11, 318 | "hiddenColor": "#CECECE", 319 | "itemGap": 10 320 | }, 321 | "extra": { 322 | "line": { 323 | "type": "straight", 324 | "width": 2 325 | }, 326 | "tooltip": { 327 | "showBox": true, 328 | "showArrow": true, 329 | "showCategory": false, 330 | "borderWidth": 0, 331 | "borderRadius": 0, 332 | "borderColor": "#000000", 333 | "borderOpacity": 0.7, 334 | "bgColor": "#000000", 335 | "bgOpacity": 0.7, 336 | "gridType": "solid", 337 | "dashLength": 4, 338 | "gridColor": "#CCCCCC", 339 | "fontColor": "#FFFFFF", 340 | "splitLine": true, 341 | "horizentalLine": false, 342 | "xAxisLabel": false, 343 | "yAxisLabel": false, 344 | "labelBgColor": "#FFFFFF", 345 | "labelBgOpacity": 0.7, 346 | "labelFontColor": "#666666" 347 | }, 348 | "markLine": { 349 | "type": "solid", 350 | "dashLength": 4, 351 | "data": [] 352 | } 353 | } 354 | }, 355 | "tline":{ 356 | "type": "line", 357 | "color": color, 358 | "padding": [15,10,0,15], 359 | "xAxis": { 360 | "disableGrid": false, 361 | "boundaryGap":"justify", 362 | }, 363 | "yAxis": { 364 | "gridType": "dash", 365 | "dashLength": 2, 366 | "data":[ 367 | { 368 | "min":0, 369 | "max":80 370 | } 371 | ] 372 | }, 373 | "legend": { 374 | }, 375 | "extra": { 376 | "line": { 377 | "type": "curve", 378 | "width": 2 379 | }, 380 | } 381 | }, 382 | "tarea":{ 383 | "type": "area", 384 | "color": color, 385 | "padding": [15,10,0,15], 386 | "xAxis": { 387 | "disableGrid": true, 388 | "boundaryGap":"justify", 389 | }, 390 | "yAxis": { 391 | "gridType": "dash", 392 | "dashLength": 2, 393 | "data":[ 394 | { 395 | "min":0, 396 | "max":80 397 | } 398 | ] 399 | }, 400 | "legend": { 401 | }, 402 | "extra": { 403 | "area": { 404 | "type": "curve", 405 | "opacity": 0.2, 406 | "addLine": true, 407 | "width": 2, 408 | "gradient": true 409 | }, 410 | } 411 | }, 412 | "column":{ 413 | "type": "column", 414 | "color": color, 415 | "padding": [15,15,0,5], 416 | "xAxis": { 417 | "disableGrid": true, 418 | }, 419 | "yAxis": { 420 | "data":[{"min":0}] 421 | }, 422 | "legend": { 423 | }, 424 | "extra": { 425 | "column": { 426 | "type": "group", 427 | "width": 30, 428 | "activeBgColor": "#000000", 429 | "activeBgOpacity": 0.08 430 | }, 431 | } 432 | }, 433 | "bar":{ 434 | "type": "bar", 435 | "color": color, 436 | "padding": [15,30,0,5], 437 | "xAxis": { 438 | "boundaryGap":"justify", 439 | "disableGrid":false, 440 | "min":0, 441 | "axisLine":false 442 | }, 443 | "yAxis": { 444 | }, 445 | "legend": { 446 | }, 447 | "extra": { 448 | "bar": { 449 | "type": "group", 450 | "width": 30, 451 | "meterBorde": 1, 452 | "meterFillColor": "#FFFFFF", 453 | "activeBgColor": "#000000", 454 | "activeBgOpacity": 0.08 455 | }, 456 | } 457 | }, 458 | "area":{ 459 | "type": "area", 460 | "color": color, 461 | "padding": [15,15,0,15], 462 | "xAxis": { 463 | "disableGrid": true, 464 | }, 465 | "yAxis": { 466 | "gridType": "dash", 467 | "dashLength": 2, 468 | }, 469 | "legend": { 470 | }, 471 | "extra": { 472 | "area": { 473 | "type": "straight", 474 | "opacity": 0.2, 475 | "addLine": true, 476 | "width": 2, 477 | "gradient": false 478 | }, 479 | } 480 | }, 481 | "radar":{ 482 | "type": "radar", 483 | "color": color, 484 | "padding": [5,5,5,5], 485 | "dataLabel": false, 486 | "legend": { 487 | "show": true, 488 | "position": "right", 489 | "lineHeight": 25, 490 | }, 491 | "extra": { 492 | "radar": { 493 | "gridType": "radar", 494 | "gridColor": "#CCCCCC", 495 | "gridCount": 3, 496 | "opacity": 0.2, 497 | "max": 200 498 | }, 499 | } 500 | }, 501 | "gauge":{ 502 | "type": "gauge", 503 | "color": color, 504 | "title": { 505 | "name": "66Km/H", 506 | "fontSize": 25, 507 | "color": "#2fc25b", 508 | "offsetY": 50 509 | }, 510 | "subtitle": { 511 | "name": "实时速度", 512 | "fontSize": 15, 513 | "color": "#1890ff", 514 | "offsetY": -50 515 | }, 516 | "extra": { 517 | "gauge": { 518 | "type": "default", 519 | "width": 30, 520 | "labelColor": "#666666", 521 | "startAngle": 0.75, 522 | "endAngle": 0.25, 523 | "startNumber": 0, 524 | "endNumber": 100, 525 | "labelFormat": "", 526 | "splitLine": { 527 | "fixRadius": 0, 528 | "splitNumber": 10, 529 | "width": 30, 530 | "color": "#FFFFFF", 531 | "childNumber": 5, 532 | "childWidth": 12 533 | }, 534 | "pointer": { 535 | "width": 24, 536 | "color": "auto" 537 | } 538 | } 539 | } 540 | }, 541 | "candle":{ 542 | "type": "candle", 543 | "color": color, 544 | "padding": [15,15,0,15], 545 | "enableScroll": true, 546 | "enableMarkLine": true, 547 | "dataLabel": false, 548 | "xAxis": { 549 | "labelCount": 4, 550 | "itemCount": 40, 551 | "disableGrid": true, 552 | "gridColor": "#CCCCCC", 553 | "gridType": "solid", 554 | "dashLength": 4, 555 | "scrollShow": true, 556 | "scrollAlign": "left", 557 | "scrollColor": "#A6A6A6", 558 | "scrollBackgroundColor": "#EFEBEF" 559 | }, 560 | "yAxis": { 561 | }, 562 | "legend": { 563 | }, 564 | "extra": { 565 | "candle": { 566 | "color": { 567 | "upLine": "#f04864", 568 | "upFill": "#f04864", 569 | "downLine": "#2fc25b", 570 | "downFill": "#2fc25b" 571 | }, 572 | "average": { 573 | "show": true, 574 | "name": ["MA5","MA10","MA30"], 575 | "day": [5,10,20], 576 | "color": ["#1890ff","#2fc25b","#facc14"] 577 | } 578 | }, 579 | "markLine": { 580 | "type": "dash", 581 | "dashLength": 5, 582 | "data": [ 583 | { 584 | "value": 2150, 585 | "lineColor": "#f04864", 586 | "showLabel": true 587 | }, 588 | { 589 | "value": 2350, 590 | "lineColor": "#f04864", 591 | "showLabel": true 592 | } 593 | ] 594 | } 595 | } 596 | }, 597 | "mix":{ 598 | "type": "mix", 599 | "color": color, 600 | "padding": [15,15,0,15], 601 | "xAxis": { 602 | "disableGrid": true, 603 | }, 604 | "yAxis": { 605 | "disabled": false, 606 | "disableGrid": false, 607 | "splitNumber": 5, 608 | "gridType": "dash", 609 | "dashLength": 4, 610 | "gridColor": "#CCCCCC", 611 | "padding": 10, 612 | "showTitle": true, 613 | "data": [] 614 | }, 615 | "legend": { 616 | }, 617 | "extra": { 618 | "mix": { 619 | "column": { 620 | "width": 20 621 | } 622 | }, 623 | } 624 | }, 625 | "scatter":{ 626 | "type": "scatter", 627 | "color":color, 628 | "padding":[15,15,0,15], 629 | "dataLabel":false, 630 | "xAxis": { 631 | "disableGrid": false, 632 | "gridType":"dash", 633 | "splitNumber":5, 634 | "boundaryGap":"justify", 635 | "min":0 636 | }, 637 | "yAxis": { 638 | "disableGrid": false, 639 | "gridType":"dash", 640 | }, 641 | "legend": { 642 | }, 643 | "extra": { 644 | "scatter": { 645 | }, 646 | } 647 | }, 648 | "bubble":{ 649 | "type": "bubble", 650 | "color":color, 651 | "padding":[15,15,0,15], 652 | "xAxis": { 653 | "disableGrid": false, 654 | "gridType":"dash", 655 | "splitNumber":5, 656 | "boundaryGap":"justify", 657 | "min":0, 658 | "max":250 659 | }, 660 | "yAxis": { 661 | "disableGrid": false, 662 | "gridType":"dash", 663 | "data":[{ 664 | "min":0, 665 | "max":150 666 | }] 667 | }, 668 | "legend": { 669 | }, 670 | "extra": { 671 | "bubble": { 672 | "border":2, 673 | "opacity": 0.5, 674 | }, 675 | } 676 | } 677 | } 678 | 679 | export default cfu; -------------------------------------------------------------------------------- /uni_modules/qiun-data-charts/js_sdk/u-charts/readme.md: -------------------------------------------------------------------------------- 1 | # uCharts JSSDK说明 2 | 1、如不使用uCharts组件,可直接引用u-charts.js,打包编译后会`自动压缩`,压缩后体积约为`98kb`。 3 | 2、如果100kb的体积仍需压缩,请手动删除u-charts.js内您不需要的图表类型,如k线图candle。 4 | 3、config-ucharts.js为uCharts组件的用户配置文件,升级前请`自行备份config-ucharts.js`文件,以免被强制覆盖。 5 | 3、config-echarts.js为ECharts组件的用户配置文件,升级前请`自行备份config-echarts.js`文件,以免被强制覆盖。 6 | 7 | # v1.0转v2.0注意事项 8 | 1、opts.colors变更为opts.color 9 | 2、ring圆环图的扩展配置由extra.pie变更为extra.ring 10 | 3、混合图借用的扩展配置由extra.column变更为extra.mix.column 11 | 4、全部涉及到format的格式化属性变更为formatter 12 | 5、不需要再传canvasId及$this参数,如果通过uChats获取context,可能会导致this实例混乱,导致小程序开发者工具报错。如果不使用qiun-data-charts官方组件,需要在new uCharts()实例化之前,自行获取canvas的上下文context(ctx),并传入new中的context(opts.context)。为了能跨更多的端,给您带来的不便敬请谅解。 -------------------------------------------------------------------------------- /uni_modules/qiun-data-charts/license.md: -------------------------------------------------------------------------------- 1 | Apache License 2 | Version 2.0, January 2004 3 | http://www.apache.org/licenses/ 4 | 5 | TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION 6 | 7 | 1. Definitions. 8 | 9 | "License" shall mean the terms and conditions for use, reproduction, 10 | and distribution as defined by Sections 1 through 9 of this document. 11 | 12 | "Licensor" shall mean the copyright owner or entity authorized by 13 | the copyright owner that is granting the License. 14 | 15 | "Legal Entity" shall mean the union of the acting entity and all 16 | other entities that control, are controlled by, or are under common 17 | control with that entity. For the purposes of this definition, 18 | "control" means (i) the power, direct or indirect, to cause the 19 | direction or management of such entity, whether by contract or 20 | otherwise, or (ii) ownership of fifty percent (50%) or more of the 21 | outstanding shares, or (iii) beneficial ownership of such entity. 22 | 23 | "You" (or "Your") shall mean an individual or Legal Entity 24 | exercising permissions granted by this License. 25 | 26 | "Source" form shall mean the preferred form for making modifications, 27 | including but not limited to software source code, documentation 28 | source, and configuration files. 29 | 30 | "Object" form shall mean any form resulting from mechanical 31 | transformation or translation of a Source form, including but 32 | not limited to compiled object code, generated documentation, 33 | and conversions to other media types. 34 | 35 | "Work" shall mean the work of authorship, whether in Source or 36 | Object form, made available under the License, as indicated by a 37 | copyright notice that is included in or attached to the work 38 | (an example is provided in the Appendix below). 39 | 40 | "Derivative Works" shall mean any work, whether in Source or Object 41 | form, that is based on (or derived from) the Work and for which the 42 | editorial revisions, annotations, elaborations, or other modifications 43 | represent, as a whole, an original work of authorship. For the purposes 44 | of this License, Derivative Works shall not include works that remain 45 | separable from, or merely link (or bind by name) to the interfaces of, 46 | the Work and Derivative Works thereof. 47 | 48 | "Contribution" shall mean any work of authorship, including 49 | the original version of the Work and any modifications or additions 50 | to that Work or Derivative Works thereof, that is intentionally 51 | submitted to Licensor for inclusion in the Work by the copyright owner 52 | or by an individual or Legal Entity authorized to submit on behalf of 53 | the copyright owner. For the purposes of this definition, "submitted" 54 | means any form of electronic, verbal, or written communication sent 55 | to the Licensor or its representatives, including but not limited to 56 | communication on electronic mailing lists, source code control systems, 57 | and issue tracking systems that are managed by, or on behalf of, the 58 | Licensor for the purpose of discussing and improving the Work, but 59 | excluding communication that is conspicuously marked or otherwise 60 | designated in writing by the copyright owner as "Not a Contribution." 61 | 62 | "Contributor" shall mean Licensor and any individual or Legal Entity 63 | on behalf of whom a Contribution has been received by Licensor and 64 | subsequently incorporated within the Work. 65 | 66 | 2. Grant of Copyright License. Subject to the terms and conditions of 67 | this License, each Contributor hereby grants to You a perpetual, 68 | worldwide, non-exclusive, no-charge, royalty-free, irrevocable 69 | copyright license to reproduce, prepare Derivative Works of, 70 | publicly display, publicly perform, sublicense, and distribute the 71 | Work and such Derivative Works in Source or Object form. 72 | 73 | 3. Grant of Patent License. Subject to the terms and conditions of 74 | this License, each Contributor hereby grants to You a perpetual, 75 | worldwide, non-exclusive, no-charge, royalty-free, irrevocable 76 | (except as stated in this section) patent license to make, have made, 77 | use, offer to sell, sell, import, and otherwise transfer the Work, 78 | where such license applies only to those patent claims licensable 79 | by such Contributor that are necessarily infringed by their 80 | Contribution(s) alone or by combination of their Contribution(s) 81 | with the Work to which such Contribution(s) was submitted. If You 82 | institute patent litigation against any entity (including a 83 | cross-claim or counterclaim in a lawsuit) alleging that the Work 84 | or a Contribution incorporated within the Work constitutes direct 85 | or contributory patent infringement, then any patent licenses 86 | granted to You under this License for that Work shall terminate 87 | as of the date such litigation is filed. 88 | 89 | 4. Redistribution. You may reproduce and distribute copies of the 90 | Work or Derivative Works thereof in any medium, with or without 91 | modifications, and in Source or Object form, provided that You 92 | meet the following conditions: 93 | 94 | (a) You must give any other recipients of the Work or 95 | Derivative Works a copy of this License; and 96 | 97 | (b) You must cause any modified files to carry prominent notices 98 | stating that You changed the files; and 99 | 100 | (c) You must retain, in the Source form of any Derivative Works 101 | that You distribute, all copyright, patent, trademark, and 102 | attribution notices from the Source form of the Work, 103 | excluding those notices that do not pertain to any part of 104 | the Derivative Works; and 105 | 106 | (d) If the Work includes a "NOTICE" text file as part of its 107 | distribution, then any Derivative Works that You distribute must 108 | include a readable copy of the attribution notices contained 109 | within such NOTICE file, excluding those notices that do not 110 | pertain to any part of the Derivative Works, in at least one 111 | of the following places: within a NOTICE text file distributed 112 | as part of the Derivative Works; within the Source form or 113 | documentation, if provided along with the Derivative Works; or, 114 | within a display generated by the Derivative Works, if and 115 | wherever such third-party notices normally appear. The contents 116 | of the NOTICE file are for informational purposes only and 117 | do not modify the License. You may add Your own attribution 118 | notices within Derivative Works that You distribute, alongside 119 | or as an addendum to the NOTICE text from the Work, provided 120 | that such additional attribution notices cannot be construed 121 | as modifying the License. 122 | 123 | You may add Your own copyright statement to Your modifications and 124 | may provide additional or different license terms and conditions 125 | for use, reproduction, or distribution of Your modifications, or 126 | for any such Derivative Works as a whole, provided Your use, 127 | reproduction, and distribution of the Work otherwise complies with 128 | the conditions stated in this License. 129 | 130 | 5. Submission of Contributions. Unless You explicitly state otherwise, 131 | any Contribution intentionally submitted for inclusion in the Work 132 | by You to the Licensor shall be under the terms and conditions of 133 | this License, without any additional terms or conditions. 134 | Notwithstanding the above, nothing herein shall supersede or modify 135 | the terms of any separate license agreement you may have executed 136 | with Licensor regarding such Contributions. 137 | 138 | 6. Trademarks. This License does not grant permission to use the trade 139 | names, trademarks, service marks, or product names of the Licensor, 140 | except as required for reasonable and customary use in describing the 141 | origin of the Work and reproducing the content of the NOTICE file. 142 | 143 | 7. Disclaimer of Warranty. Unless required by applicable law or 144 | agreed to in writing, Licensor provides the Work (and each 145 | Contributor provides its Contributions) on an "AS IS" BASIS, 146 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or 147 | implied, including, without limitation, any warranties or conditions 148 | of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A 149 | PARTICULAR PURPOSE. You are solely responsible for determining the 150 | appropriateness of using or redistributing the Work and assume any 151 | risks associated with Your exercise of permissions under this License. 152 | 153 | 8. Limitation of Liability. In no event and under no legal theory, 154 | whether in tort (including negligence), contract, or otherwise, 155 | unless required by applicable law (such as deliberate and grossly 156 | negligent acts) or agreed to in writing, shall any Contributor be 157 | liable to You for damages, including any direct, indirect, special, 158 | incidental, or consequential damages of any character arising as a 159 | result of this License or out of the use or inability to use the 160 | Work (including but not limited to damages for loss of goodwill, 161 | work stoppage, computer failure or malfunction, or any and all 162 | other commercial damages or losses), even if such Contributor 163 | has been advised of the possibility of such damages. 164 | 165 | 9. Accepting Warranty or Additional Liability. While redistributing 166 | the Work or Derivative Works thereof, You may choose to offer, 167 | and charge a fee for, acceptance of support, warranty, indemnity, 168 | or other liability obligations and/or rights consistent with this 169 | License. However, in accepting such obligations, You may act only 170 | on Your own behalf and on Your sole responsibility, not on behalf 171 | of any other Contributor, and only if You agree to indemnify, 172 | defend, and hold each Contributor harmless for any liability 173 | incurred by, or claims asserted against, such Contributor by reason 174 | of your accepting any such warranty or additional liability. 175 | 176 | END OF TERMS AND CONDITIONS 177 | 178 | APPENDIX: How to apply the Apache License to your work. 179 | 180 | To apply the Apache License to your work, attach the following 181 | boilerplate notice, with the fields enclosed by brackets "[]" 182 | replaced with your own identifying information. (Don't include 183 | the brackets!) The text should be enclosed in the appropriate 184 | comment syntax for the file format. We also recommend that a 185 | file or class name and description of purpose be included on the 186 | same "printed page" as the copyright notice for easier 187 | identification within third-party archives. 188 | 189 | Copyright [yyyy] [name of copyright owner] 190 | 191 | Licensed under the Apache License, Version 2.0 (the "License"); 192 | you may not use this file except in compliance with the License. 193 | You may obtain a copy of the License at 194 | 195 | http://www.apache.org/licenses/LICENSE-2.0 196 | 197 | Unless required by applicable law or agreed to in writing, software 198 | distributed under the License is distributed on an "AS IS" BASIS, 199 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 200 | See the License for the specific language governing permissions and 201 | limitations under the License. 202 | -------------------------------------------------------------------------------- /uni_modules/qiun-data-charts/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "id": "qiun-data-charts", 3 | "displayName": "秋云 ucharts echarts 高性能跨全端图表组件", 4 | "version": "2.3.7-20220122", 5 | "description": "uCharts v2.3.7支持Vue3!全新官方图表组件,支持H5及APP用ECharts渲染图表,uniapp可视化首选组件", 6 | "keywords": [ 7 | "ucharts", 8 | "echarts", 9 | "f2", 10 | "图表", 11 | "可视化" 12 | ], 13 | "repository": "https://gitee.com/uCharts/uCharts", 14 | "engines": { 15 | "HBuilderX": "^3.3.8" 16 | }, 17 | "dcloudext": { 18 | "category": [ 19 | "前端组件", 20 | "通用组件" 21 | ], 22 | "sale": { 23 | "regular": { 24 | "price": "0.00" 25 | }, 26 | "sourcecode": { 27 | "price": "0.00" 28 | } 29 | }, 30 | "contact": { 31 | "qq": "474119" 32 | }, 33 | "declaration": { 34 | "ads": "无", 35 | "data": "插件不采集任何数据", 36 | "permissions": "无" 37 | }, 38 | "npmurl": "" 39 | }, 40 | "uni_modules": { 41 | "dependencies": [], 42 | "encrypt": [], 43 | "platforms": { 44 | "cloud": { 45 | "tcb": "y", 46 | "aliyun": "y" 47 | }, 48 | "client": { 49 | "App": { 50 | "app-vue": "y", 51 | "app-nvue": "y" 52 | }, 53 | "H5-mobile": { 54 | "Safari": "y", 55 | "Android Browser": "y", 56 | "微信浏览器(Android)": "y", 57 | "QQ浏览器(Android)": "y" 58 | }, 59 | "H5-pc": { 60 | "Chrome": "y", 61 | "IE": "y", 62 | "Edge": "y", 63 | "Firefox": "y", 64 | "Safari": "y" 65 | }, 66 | "小程序": { 67 | "微信": "y", 68 | "阿里": "y", 69 | "百度": "y", 70 | "字节跳动": "y", 71 | "QQ": "y" 72 | }, 73 | "快应用": { 74 | "华为": "y", 75 | "联盟": "y" 76 | }, 77 | "Vue": { 78 | "vue2": "y", 79 | "vue3": "y" 80 | } 81 | } 82 | } 83 | } 84 | } -------------------------------------------------------------------------------- /uni_modules/qiun-data-charts/readme.md: -------------------------------------------------------------------------------- 1 | ## [uCharts官方网站](https://www.ucharts.cn) 2 | ## [DEMO演示及在线生成工具(v2.0文档)https://demo.ucharts.cn](https://demo.ucharts.cn) 3 | ## [优秀的nvue全端组件与模版库nPro](https://ext.dcloud.net.cn/plugin?id=5169) 4 | ## [图表组件在项目中的应用 UReport数据报表](https://ext.dcloud.net.cn/plugin?id=4651) 5 | ## [如何安装、更新 uni_modules 插件点这里,必看,必看,必看](https://uniapp.dcloud.io/uni_modules?id=%e4%bd%bf%e7%94%a8-uni_modules-%e6%8f%92%e4%bb%b6) 6 | ## 点击右侧绿色【使用HBuilderX导入插件】即可使用,示例项目请点击右侧蓝色按钮【使用HBuilderX导入示例项目】。 7 | ## 初次使用不显示问题详见[常见问题选项卡](https://demo.ucharts.cn) 8 | ## 新手请先完整阅读【帮助文档】及【常见问题】3遍,右侧蓝色按钮【示例项目】请看2遍! 9 | ## 关于NVUE兼容的说明: uCharts.js从2.3.0开始支持nuve(暂时只能通过原生canvas写法调用uCharts,nuve版本组件请见码云示例项目[uCharts-demo-nvue](https://gitee.com/uCharts/uCharts)),因其渲染方式是通过nvue的gcanvas组件来渲染,理论上性能不及renderjs的qiun-data-charts组件性能。官方仍然建议NVUE使用图表的页面改为vue页面,在App端,从性能来讲,由于通讯阻塞的问题,nvue的canvas性能不可能达到使用renderjs的vue页面的canvas。在App端,仍然推荐使用qiun-data-charts组件。[详见uni-app官方说明](https://uniapp.dcloud.io/component/canvas?id=canvas) 10 | 11 | [![uCharts/uCharts](https://gitee.com/uCharts/uCharts/widgets/widget_card.svg?colors=393222,ebdfc1,fffae5,d8ca9f,393222,a28b40)](https://gitee.com/uCharts/uCharts) 12 | 13 | ## 秋云图表组件使用帮助 14 | 15 | 全新图表组件,全端全平台支持,开箱即用,可选择uCharts引擎全端渲染,也可指定PC端或APP端`单独使用ECharts`引擎渲染图表。支持极简单的调用方式,只需指定图表类型及传入符合标准的图表数据即可,使开发者只需专注业务及数据。同时也支持datacom组件读取uniClinetDB,无需关心如何拼接数据等不必要的重复工作,大大缩短开发时间。 16 | 17 | ## 为何使用官方封装的组件? 18 | 19 | 封装组件并不难,谁都会,但组件调试却是一件令人掉头发的事,尤其是canvas封装成组件会带来一系列问题:例如封装后不显示,图表多次初始化导致抖动问题,单页面多个图表点击事件错乱,组件放在scroll-view中无法点击,在图表上滑动时页面无法滚动等等一系列问题。为解决开发者使用可视化组件的困扰,uCharts官方特推出可视化通用组件,本组件具备以下特点: 20 | 21 | - 极简单的调用方式,默认配置下只需要传入`图表类型`及`图表数据`即可全端显示。 22 | - 提供强大的`在线配置生成工具`,可视化中的可视化,鼠标点一点就可以生成图表,可视化从此不再难配。 23 | - 兼容ECharts,可选择`PC端或APP端单独使用ECharts`引擎渲染图表。 24 | - H5及App采用`renderjs`渲染图表,动画流畅、性能翻倍。 25 | - 根据父容器尺寸`弹性显示图表`,再也不必为宽高匹配及多端适配问题发愁。 26 | - 支持`加载状态loading及error展示`,避免数据读取显示空白的尴尬。 27 | - chartData`配置与数据解耦`,即便使用ECharts引擎也不必担心拼接option的困扰。 28 | - localdata`后端数据直接渲染`,无需自行拼接chartData的categories及series,从后端拿回的数据简单处理即可生成图表。 29 | - 小程序端不必担心包体积过大问题,ECharts引擎将不会编译到各小程序端,u-charts.js编译后`仅为93kb`。 30 | - 未来将支持通过HbuilderX的[schema2code自动生成全端全平台图表](https://ext.dcloud.net.cn/plugin?id=4684),敬请期待!!! 31 | - uCharts官方拥有4个2000人的QQ群支持,庞大的用户量证明我们一直在努力,本组件将持续更新,请各位放心使用,您的宝贵建议是我们努力的动力!! 32 | 33 | 34 | ## 致开发者 35 | 36 | 感谢各位开发者`三年`来对秋云及uCharts的支持,uCharts的进步离不开各位开发者的鼓励与贡献,为更好的帮助各位开发者在uni-app生态系统更好的应用图表,uCharts始终坚持开源,并提供社群帮助开发者解决问题。 为确保您能更好的应用图表组件,建议您先`仔细阅读本页文档`以及uCharts官方文档,而不是下载下来`直接使用`。 如遇到问题请先阅读文档,如仍然不能解决,请加入QQ群咨询,如群友均不能解决或者您有特殊需求,请在群内私聊我,因工作原因,回复不一定很及时,您可直接说问题,有时间一定会回复您。 37 | 38 | uCharts的开源图表组件的开发,付出了大量的个人时间与精力,经过两年来的考验,不会有比较明显的bug,请各位放心使用。不求您5星评价,也不求您赞赏,`只求您对开源贡献的支持态度`,所以,当您想给`1星评价`的时候,秋云真的会`含泪希望您绕路而行……`。如果您有更好的想法,可以在`码云提交Pull Requests`以帮助更多开发者完成需求,再次感谢各位对uCharts的鼓励与支持! 39 | 40 | ## 快速体验 41 | 42 | 一套代码编到7个平台,依次扫描二维码,亲自体验uCharts图表跨平台效果!IOS因demo比较简单无法上架,请自行编译。 43 | ![](https://box.kancloud.cn/58092090f2bccc6871ca54dbec268811_654x479.png) 44 | 45 | ## 快速上手 46 | ### 注意前提条件【版本要求:HBuilderX 3.1.0+】 47 | - 1、插件市场点击右侧绿色按钮【使用HBuilderX导入插件】,或者【使用HBuilderX导入示例项目】查看完整示例工程 48 | - 2、依赖uniapp的vue-cli项目:请将uni-modules目录复制到src目录,即src/uni_modules。(请升级uniapp依赖为最新版本) 49 | - 3、页面中直接按下面用法直接调用即可,无需在页面中注册组件qiun-data-charts 50 | - 4、注意父元素class='charts-box'这个样式需要有宽高 51 | 52 | ## 基本用法 53 | 54 | - template代码:([建议使用在线工具生成](https://demo.ucharts.cn)) 55 | 56 | ``` 57 | 58 | 59 | 60 | ``` 61 | 62 | - 标准数据格式1:(折线图、柱状图、区域图等需要categories的直角坐标系图表类型) 63 | 64 | ``` 65 | chartData:{ 66 | categories: ["2016", "2017", "2018", "2019", "2020", "2021"], 67 | series: [{ 68 | name: "目标值", 69 | data: [35, 36, 31, 33, 13, 34] 70 | }, { 71 | name: "完成量", 72 | data: [18, 27, 21, 24, 6, 28] 73 | }] 74 | } 75 | ``` 76 | 77 | - 标准数据格式2:(饼图、圆环图、漏斗图等不需要categories的图表类型) 78 | 79 | ``` 80 | chartData:{ 81 | series: [{ 82 | data: [ 83 | { 84 | name: "一班", 85 | value: 50 86 | }, { 87 | name: "二班", 88 | value: 30 89 | }, { 90 | name: "三班", 91 | value: 20 92 | }, { 93 | name: "四班", 94 | value: 18 95 | }, { 96 | name: "五班", 97 | value: 8 98 | } 99 | ] 100 | }] 101 | } 102 | ``` 103 | 104 | 注:其他特殊图表类型,请参考mockdata文件夹下的数据格式,v2.0版本的uCharts已兼容ECharts的数据格式,v2.0版本仍然支持v1.0版本的数据格式。 105 | 106 | ## localdata数据渲染用法 107 | 108 | - 使用localdata数据格式渲染图表的优势:数据结构简单,无需自行拼接chartData的categories及series,从后端拿回的数据简单处理即可生成图表。 109 | - localdata数据的缺点:并不是所有的图表类型均可通过localdata渲染图表,例如混合图,组件并不能识别哪个series分组需要渲染成折线还是柱状图,涉及到复杂的图表,仍需要由chartData传入。 110 | 111 | - template代码:([建议使用在线工具生成](https://demo.ucharts.cn)) 112 | 113 | ``` 114 | 115 | 116 | 117 | ``` 118 | 119 | 120 | - 标准数据格式1:(折线图、柱状图、区域图等需要categories的直角坐标系图表类型) 121 | 122 | 其中value代表数据的数值,text代表X轴的categories数据点,group代表series分组的类型名称即series[i].name。 123 | 124 | ``` 125 | localdata:[ 126 | {value:35, text:"2016", group:"目标值"}, 127 | {value:18, text:"2016", group:"完成量"}, 128 | {value:36, text:"2017", group:"目标值"}, 129 | {value:27, text:"2017", group:"完成量"}, 130 | {value:31, text:"2018", group:"目标值"}, 131 | {value:21, text:"2018", group:"完成量"}, 132 | {value:33, text:"2019", group:"目标值"}, 133 | {value:24, text:"2019", group:"完成量"}, 134 | {value:13, text:"2020", group:"目标值"}, 135 | {value:6, text:"2020", group:"完成量"}, 136 | {value:34, text:"2021", group:"目标值"}, 137 | {value:28, text:"2021", group:"完成量"} 138 | ] 139 | ``` 140 | 141 | - 标准数据格式2:(饼图、圆环图、漏斗图等不需要categories的图表类型) 142 | 143 | 其中value代表数据的数值,text代表value数值对应的描述。 144 | 145 | ``` 146 | localdata:[ 147 | {value:50, text:"一班"}, 148 | {value:30, text:"二班"}, 149 | {value:20, text:"三班"}, 150 | {value:18, text:"四班"}, 151 | {value:8, text:"五班"}, 152 | ] 153 | ``` 154 | 155 | - 注意,localdata的数据格式必需要符合datacom组件规范[【详见datacom组件】](https://uniapp.dcloud.io/component/datacom?id=mixindatacom)。 156 | 157 | ## 进阶用法读取uniCloud数据库并渲染图表 158 | 159 | - 组件基于uniCloud的[clientDB](https://uniapp.dcloud.net.cn/uniCloud/clientdb)技术,无需云函数,在前端对数据库通过where查询条件及group和count统计即可渲染图表。 160 | - 具体可参考/pages/unicloud/unicloud.vue中的demo例子,使用前,请先关联云服务空间,然后在uniCloud/database/db_init.json文件上点右键,初始化云数据库,当控制台显示“初始化云数据库完成”即完成示例数据的导入,之后方可运行uniCloud的demo。 161 | 162 | - template代码: 163 | 164 | ``` 165 | 174 | ``` 175 | 176 | - 注意,从uniCloud读取出的数据,需要符合localdata的标准结果数据格式(参考上部分localdata),并需要把输出的字段as成规定的别名(value、text、group)。 177 | 178 | 179 | ## 示例文件地址: 180 | 181 | ### 强烈建议先看本页帮助,再看下面示例文件源码! 182 | 183 | ``` 184 | /pages/ucharts/ucharts.vue(展示用uCharts全端运行的例子) 185 | 186 | /pages/echarts/echarts.vue(展示H5和App用ECharts,小程序端用uCharts的例子) 187 | 188 | /pages/unicloud/unicloud.vue(展示读取uniCloud数据库后直接渲染图表的例子) 189 | 190 | /pages/updata/updata.vue(展示动态更新图表数据的例子) 191 | 192 | /pages/other/other.vue(展示图表交互的例子:动态更新图表数据,渲染完成事件,获取点击索引,自定义tooltip,图表保存为图片,强制展示错误信息等) 193 | 194 | /pages/format-u/format-u.vue(展示uCharts的formatter用法的例子) 195 | 196 | /pages/format-e/format-e.vue(展示ECharts的formatter用法的例子) 197 | 198 | /pages/tab/tab.vue(展示再tab选项卡中用法的例子,即父容器采用v-show或v-if时需要注意的问题) 199 | 200 | /pages/layout/layout.vue(展示特殊布局用法的例子:swiper、scroll-view、绝对定位等布局) 201 | 202 | /pages/canvas/canvas.vue(展示uCharts v2.0版本原生js用法的例子) 203 | 204 | ``` 205 | 206 | 207 | ## 组件基本API参数 208 | 209 | |属性名|类型|默认值|必填|说明| 210 | | -- | -- | -- | -- | -- | 211 | |type|String|null|`是`|图表类型,如全端用uCharts,可选值为pie、ring、rose、word、funnel、map、arcbar、line、column、bar、area、radar、gauge、candle、mix、tline、tarea、scatter、bubble (您也可以根据需求自定义新图表类型,需要在config-ucharts.js或config-echarts.js内添加,可参考config-ucharts.js内的"demotype"类型)| 212 | |chartData|Object|见说明|`是`|图表数据,常用的标准数据格式为{categories: [],series: []},请按不同图表类型传入对应的标准数据。| 213 | |localdata|Array|[]|`是`|图表数据,如果您觉得拼接上面chartData比较繁琐,可以通过使用localdata渲染,组件会根据传入的type类型,自动拼接categories或series数据(使用localdata就不必再传入chartData,详见 /pages/other/other.vue 中使用localdata渲染图表的例子)。【localdata和collection(uniCloud数据库)同时存在,优先使用localdata;如果localdata和chartData同时存在,优先使用chartData。 即chartData>localdata>collection的优先级渲染图表】。| 214 | |opts|Object|{}|否|uCharts图表配置参数(option),请参考[【在线生成工具】](https://demo.ucharts.cn)注:传入的opts会覆盖默认config-ucharts.js中的配置,只需传入与config-ucharts.js中属性不一致的opts即可实现【同类型的图表显示不同的样式】。| 215 | |eopts|Object|{}|否|ECharts图表配置参数(option),请参考[【ECharts配置手册】](https://echarts.apache.org/zh/option.html)传入eopts。注:1、传入的eopts会覆盖默认config-echarts.js中的配置,以实现同类型的图表显示不同的样式。2、eopts不能传递function,如果option配置参数需要function,请将option写在config-echarts.js中即可实现。| 216 | |loadingType|Number|2|否|加载动画样式,0为不显示加载动画,1-5为不同的样式,见下面示例。| 217 | |errorShow|Boolean|true|否|是否在页面上显示错误提示,true为显示错误提示图片,false时会显示空白区域| 218 | |errorReload|Boolean|true|否|是否启用点击错误提示图表重新加载,true为允许点击重新加载,false为禁用点击重新加载事件| 219 | |errorMessage|String|null|否|自定义错误信息,强制显示错误图片及错误信息,当上面errorShow为true时可用。(组件会监听该属性的变化,只要有变化,就会强制显示错误信息!)。说明:1、一般用于页面网络不好或其他情况导致图表loading动画一直显示,可以传任意(不为null或者"null"或者空"")字符串强制显示错误图片及说明。2、如果组件使用了data-come属性读取uniCloud数据,组件会自动判断错误状态并展示错误图标,不必使用此功能。3、当状态从非null改变为null或者空时,会强制调用reload重新加载并渲染图表数据。| 220 | |echartsH5|Boolean|false|否|是否在H5端使用ECharts引擎渲染图表| 221 | |directory|String|'/'|否|二级目录名称,如果开启上面echartsH5即H5端用ECharts引擎渲染图表,并且项目未发布在website根目录,需要填写此项配置。例如二级目录是h5,则需要填写`/h5/`,左右两侧需要带`/`,发布到三级或更多层目录示例`/web/v2/h5/`| 222 | |echartsApp|Boolean|false|否|是否在APP端使用ECharts引擎渲染图表| 223 | |canvasId|String|见说明|否|默认生成32位随机字符串。如果指定canvasId,可方便后面调用指定图表实例,否则需要通过渲染完成事件获取自动生成随机的canvasId| 224 | |canvas2d|Boolean|false|否|是否开启canvas2d模式,用于解决微信小程序层级过高问题,仅微信小程序端可用,其他端会强制关闭canvas2d模式。注:开启canvas2d模式,必须要传入上面的canvasId(随机字符串,不能是动态绑定的值,不能是数字),否则微信小程序可能会获取不到dom导致无法渲染图表!**开启后,开发者工具显示不正常,预览正常(不能“真机调试”,不能“真机调试”,不能“真机调试”)**| 225 | |background|String|none|否|背景颜色,默认透明none,可选css的16进制color值,如#FFFFFF| 226 | |animation|Boolean|true|否|是否开启图表动画效果| 227 | |inScrollView|Boolean|false|否|图表组件是否在scroll-view中,如果在请传true,否则会出现点击事件坐标不准确的现象| 228 | |pageScrollTop|Number|0|否|如果图表组件是在scroll-view中,并且整个页面还存在滚动条,这个值应为绑定为页面滚动条滚动的距离,否则会出现点击事件坐标不准确的现象| 229 | |reshow|Boolean|false|否|强制重新渲染属性,如果图表组件父级用v-show包裹,初始化的时候会获取不到元素的宽高值,导致渲染失败,此时需要把父元素的v-show方法复制到reshow中,组件检测到reshow值变化并且为true的时候会强制重新渲染| 230 | |reload|Boolean|false|否|强制重新加载属性,与上面的reshow区别在于:1、reload会重新显示loading动画;2、如果组件绑定了uniCloud数据查询,通过reload会重新执行SQL语句查询,重新请求网络。而reshow则不会显示loading动画,只是应用现有的chartData数据进行重新渲染| 231 | |disableScroll|Boolean|false|否|当在canvas中移动时,且有绑定手势事件时,禁止屏幕滚动以及下拉刷新(赋值为true时,在图表区域内无法拖动页面滚动)| 232 | |tooltipShow|Boolean|true|否|点击或者鼠标经过图表时,是否显示tooltip提示窗,默认显示| 233 | |tooltipFormat|String|undefined|否|自定义格式化Tooltip显示内容,详见下面【tooltipFormat格式化】| 234 | |tooltipCustom|Object|undefined|否|(仅uCharts)如果以上系统自带的Tooltip格式化方案仍然不满足您,您可以用此属性实现更多需求,详见下面【tooltipCustom自定义】| 235 | |startDate|String|undefined|否|需为标准时间格式,例如"2021-02-14"。用于配合uniClinetDB自动生成categories使用| 236 | |endDate|String|undefined|否|需为标准时间格式,例如"2021-03-31"。用于配合uniClinetDB自动生成categories使用| 237 | |groupEnum|Array|[]|否|当使用到uniCloud数据库时,group字段属性如果遇到统计枚举属性的字段,需要通过将DB Schema中的enum的描述定义指派给该属性,具体格式为[{value: 1,text: "男"},{value: 2,text: "女"}]| 238 | |textEnum|Array|[]|否|当使用到uniCloud数据库时,text字段属性如果遇到统计枚举属性的字段,需要通过将DB Schema中的enum的描述定义指派给该属性,具体格式为[{value: 1,text: "男"},{value: 2,text: "女"}]| 239 | |ontap|Boolean|true|否|是否监听@tap@cilck事件,禁用后不会触发组件点击事件| 240 | |ontouch|Boolean|false|否|(仅uCharts)是否监听@touchstart@touchmove@touchend事件(赋值为true时,非PC端在图表区域内无法拖动页面滚动)| 241 | |onmouse|Boolean|true|否|是否监听@mousedown@mousemove@mouseup事件,禁用后鼠标经过图表上方不会显示tooltip| 242 | |on movetip|Boolean|false|否|(仅uCharts)是否开启跟手显示tooltip功能(前提条件,1、需要开启touch功能,即:ontouch="true";2、并且opts.enableScroll=false即关闭图表的滚动条功能)(建议微信小程序开启canvas2d功能,否则原生canvas组件会很卡)| 243 | |tapLegend|Boolean|true|否|(仅uCharts)是否开启图例点击交互事件 | 244 | 245 | ## 组件事件及方法 246 | 247 | |事件名|说明| 248 | | --| --| 249 | |@complete|图表渲染完成事件,渲染完成会返回图表实例{complete: true, id:"xxxxx"(canvasId), type:"complete"}。可以引入config-ucharts.js/config-echarts.js来根据返回的id,调用uCharts或者ECharts实例的相关方法,详见other.vue其他图表高级应用。| 250 | |@getIndex|获取点击数据索引,点击后返回图表索引currentIndex,图例索引(仅uCharts)legendIndex,等信息。返回数据:{type: "getIndex", currentIndex: 3, legendIndex: -1, id:"xxxxx"(canvasId), event: {x: 100, y: 100}(点击坐标值)}| 251 | |@error|当组件发生错误时会触发该事件。返回数据:返回数据:{type:"error",errorShow:true/false(组件props中的errorShow状态值) , msg:"错误消息xxxx", id: "xxxxx"(canvasId)}| 252 | |@getTouchStart|(仅uCharts)拖动开始监听事件。返回数据:{type:"touchStart",event:{x: 100, y: 100}(点击坐标值),id:"xxxxx"(canvasId)}| 253 | |@getTouchMove|(仅uCharts)拖动中监听事件。返回数据:{type:"touchMove",event:{x: 100, y: 100}(点击坐标值),id:"xxxxx"(canvasId)}| 254 | |@getTouchEnd|(仅uCharts)拖动结束监听事件。返回数据:{type:"touchEnd",event:{x: 100, y: 100}(点击坐标值),id:"xxxxx"(canvasId)}| 255 | |@scrollLeft|(仅uCharts)开启滚动条后,滚动条到最左侧触发的事件,用于动态打点,需要自行编写防抖方法。返回数据:{type:"scrollLeft", scrollLeft: true, id: "xxxxx"(canvasId)}| 256 | |@scrollRight|(仅uCharts)开启滚动条后,滚动条到最右侧触发的事件,用于动态打点,需要自行编写防抖方法。返回数据:返回数据:{type:"scrollRight", scrollRight: true, id: "xxxxx"(canvasId)}| 257 | 258 | ## tooltipFormat格式化(uCharts和ECharts) 259 | 260 | tooltipFormat类型为string字符串类型,需要指定config-ucharts.js/config-echarts.js中formatter下的属性值。因各小程序及app端通过组件均不能传递function类型参数,因此请先在config-ucharts.js/config-echarts.js内定义您想格式化的数据,然后在这里传入formatter下的key值,组件会自动匹配与其对应的function。如不定义该属性,组件会调用默认的tooltip方案,标准的tooltipFormat使用姿势如下: 261 | 262 | ``` 263 | 268 | ================== 269 | config-ucharts.js 270 | formatter:{ 271 | tooltipDemo1:function(item, category, index, opts){return item.data+'天'} 272 | } 273 | ================== 274 | config-echarts.js 275 | formatter:{ 276 | tooltipDemo1:function(){ 277 | 278 | } 279 | } 280 | ``` 281 | 282 | 注意,config-ucharts.js内的formatter下的function需要携带(item, category, index, opts)参数,这4个参数都是uCharts实例内传递过来的数据,具体定义如下: 283 | 284 | |属性名|说明| 285 | | -- | -- | 286 | |item|组件内计算好的当前点位的series[index]数据,其属性有data(继承series[index].format属性),color,type,style,pointShape,disableLegend,name,show| 287 | |category|当前点位的X轴categories[index]分类名称(如果图表类型没有category,其值则为undefined)| 288 | |index|当前点位的索引值| 289 | |opts|全部uCharts的opts配置,包含categories、series等一切你需要的都在里面,可以根据index索引值获取其他相关数据。您可以在渲染完成后打印一下opts,看看里面都有什么,也可以自定义一些你需要的挂载到opts上,这样就可以根据需求更方便的显示自定义内容了。| 290 | 291 | ## tooltipCustom自定义(仅uCharts) 292 | 293 | 上面仅仅展示了Tooltip的自定义格式化,如果仍然仍然还不能还不能满足您的需求,只能看这里的方法了。tooltipCustom可以自定义在任何位置显示任何内容的文本,当然tooltipCustom可以和tooltipFormat格式化同时使用以达到更多不同的需求,下面展示了tooltip固定位置显示的方法: 294 | 295 | ``` 296 | 301 | ``` 302 | 303 | tooltipCustom属性如下: 304 | 305 | |属性名|类型|默认值|说明| 306 | | -- | -- | -- | -- | 307 | |x|Number|undefined|tooltip左上角相对于画布的X坐标| 308 | |y|Number|undefined|tooltip左上角相对于画布的Y坐标| 309 | |index|Number|undefined|相对于series或者categories中的索引值。当没有定义index或者index定义为undefined的时候,组件会自动获取当前点击的索引,并根据上面的xy位置绘制tooltip提示框。如果为0及以上的数字时,会根据您传的索引自动计算x轴方向的偏移量(仅直角坐标系有效)| 310 | |textList|Array.Object|undefined|多对象数组,tooltip的文字组。当没有定义textList或者textList定义为undefined的时候,会调自动获取点击索引并拼接相应的textList。如传递[{text:'默认显示的tooltip',color:null},{text:'类别1:某个值xxx',color:'#2fc25b'},{text:'类别2:某个值xxx',color:'#facc14'},{text:'类别3:某个值xxx',color:'#f04864'}]这样定义好的数组,则会只显示该数组。| 311 | |textList[i].text|String| |显示的文字| 312 | |textList[i].color|Color| |左侧图表颜色| 313 | 314 | ## datacome属性及说明 315 | 316 | - 通过配置datacome属性,可直接获取uniCloud云数据,并快速自动生成图表,使开发者只需专注业务及数据,无需关心如何拼接数据等不必要的重复工作,大大缩短开发时间。datacome属性及说明,详见[datacom组件规范](https://uniapp.dcloud.io/component/datacom?id=mixindatacom) 317 | 318 | |属性名|类型|默认值|说明| 319 | | -- | -- | -- | -- | 320 | |collection|String| |表名。支持输入多个表名,用 , 分割| 321 | |field|String| |查询字段,多个字段用 , 分割| 322 | |where|String| |查询条件,内容较多,另见jql文档:[详情](https://uniapp.dcloud.net.cn/uniCloud/uni-clientDB?id=jsquery)| 323 | |orderby|String| |排序字段及正序倒叙设置| 324 | |groupby|String| |对数据进行分组| 325 | |group-field|String| |对数据进行分组统计| 326 | |distinct|Boolean|false|是否对数据查询结果中重复的记录进行去重| 327 | |action|string| |云端执行数据库查询的前或后,触发某个action函数操作,进行预处理或后处理,详情。场景:前端无权操作的数据,比如阅读数+1| 328 | |page-data|string|add|分页策略选择。值为 add 代表下一页的数据追加到之前的数据中,常用于滚动到底加载下一页;值为 replace 时则替换当前data数据,常用于PC式交互,列表底部有页码分页按钮| 329 | |page-current|Number|0|当前页| 330 | |page-size|Number|0|每页数据数量| 331 | |getcount|Boolean|false|是否查询总数据条数,默认 false,需要分页模式时指定为 true| 332 | |getone|Boolean|false|指定查询结果是否仅返回数组第一条数据,默认 false。在false情况下返回的是数组,即便只有一条结果,也需要[0]的方式获取。在值为 true 时,直接返回结果数据,少一层数组。一般用于非列表页,比如详情页| 333 | |gettree|Boolean|false|是否查询树状数据,默认 false| 334 | |startwith|String|''|gettree的第一层级条件,此初始条件可以省略,不传startWith时默认从最顶级开始查询| 335 | |limitlevel|Number|10|gettree查询返回的树的最大层级。超过设定层级的节点不会返回。默认10级,最大15,最小1| 336 | 337 | ## uni_modules目录说明 338 | 339 | ``` 340 | ├── components 341 | │ └── qiun-data-chatrs──────────# 组件主入口模块 342 | │ └── qiun-error────────────────# 加载动画组件文件目录(可以修改错误提示图标以减少包体积) 343 | │ └── qiun-loading──────────────# 加载动画组件文件目录(可以删除您不需要的动画效果以减少包体积) 344 | ├── js_skd 345 | │ └── u-charts 346 | │ ── └──config-echarts.js ──────# ECharts默认配置文件(非APP端内可作为实例公用中转) 347 | │ ── └──config-ucharts.js ──────# uCharts默认配置文件(非APP端内可作为实例公用中转) 348 | │ ── └──u-charts-v2.0.0.js──────# uCharts基础库v2.0.0版本,部分API与之前版本不同 349 | ├── static 350 | │ └── app-plus──────────────────# 条件编译目录,仅编译到APP端 351 | │ ── └──echarts.min.js──────────# Echarts基础库v4.2.1 352 | │ └── h5────────────────────────# 条件编译目录,仅编译到H5端 353 | │ ── └──echarts.min.js──────────# Echarts基础库v4.2.1 354 | ``` 355 | 356 | 357 | ## 加载动画及错误提示 358 | - 为保证编译后的包体积,加载动画引用作者wkiwi提供的[w-loading](https://ext.dcloud.net.cn/plugin?id=504)中选取5种,如需其他样式请看下面说明。 359 | - loading的展示逻辑: 360 | * 1、如果是uniCloud数据,从发送网络请求到返回数据期间展示。 361 | * 2、如果是自行传入的chartData,当chartData.series=[]空数组的时候展示loading,也就是说初始化图表的时候,如果您没有数据,可以通过先传个空数组来展示loading效果,当chartData.series有数据后会自动隐藏loading图标。 362 | - 如您修改了qiun-data-charts.vue组件文件,请务必在升级前备份您的文件,以免被覆盖!!!建议将加载状态显示做成组件,避免下次升级时丢失后无法找到。 363 | 364 | 365 | ## 配置文件说明 366 | 367 | - 注意,config-echarts.js和config-ucharts.js内只需要配置符合您项目整体UI的整体默认配置,根据需求,先用[【在线工具】](http://demo.ucharts.cn)调试好默认配置,并粘贴到配置文件中。 368 | - 如果需要与configjs中不同的配置,只需要在组件上绑定:opts或者:eopts传入与默认配置不同的某个属性及值即可覆盖默认配置,极大降低了代码量。 369 | 370 | - ECharts默认配置文件:config-echarts.js 371 | 372 | i、如您修改了默认配置文件,请务必在升级前备份您的配置文件,以免被覆盖!!! 373 | 374 | ii、ECharts配置手册:[https://echarts.apache.org/zh/option.html](https://echarts.apache.org/zh/option.html) 375 | 376 | iii、"type"及"categories"属性为支持的图表属性,您可参照ECharts配置手册,配置您更多的图表类型,并将对应的图表配置添加至下面 377 | 378 | iv、"formatter"属性,因各小程序及app端通过组件均不能传递function类型参数,因此请先在此属性下定义您想格式化的数据,组件会自动匹配与其对应的function 379 | 380 | v、"seriesTemplate"属性,因ECharts的大部分配置均在series内,seriesTemplate作为series的模板,这样只需要在这里做好模板配置,组件的数组层chartData(或者localdata或者collection)的series会自动挂载模板配置。如需临时或动态改变seriesTemplate,可在:eopts中传递seriesTemplate,详见pages/echarts/echarts.vue中的曲线图。 381 | 382 | vi、ECharts配置仅可用于H5或者APP端,并且配置`echartsH5`或`echartsApp`为`true`时可用 383 | 384 | - uCharts默认配置文件:config-ucharts.js 385 | 386 | i、如您修改了默认配置文件,请务必在升级前备份您的配置文件,以免被覆盖!!! 387 | 388 | ii、v2版本后的uCharts基础库不提供配置手册,您可以使用在线配置生成工具来快速生成配置:[http://demo.ucharts.cn](http://demo.ucharts.cn) 389 | 390 | iii、"type"及"categories"属性为支持的图表属性,不支持添加uCharts基础库没有的图表类型 391 | 392 | iv、"formatter"属性因各小程序及app端通过组件均不能传递function类型参数,因此请先在此属性下定义您想格式化的数据,组件会自动匹配与其对应的function 393 | 394 | v、uCharts配置可跨全端使用 395 | 396 | 397 | ## 常见问题及注意事项 398 | 399 | - `图表无法显示问题`: 400 | * 请先检查您的HBuilderX版本,要求高于3.1.0+。 401 | * 1、如果是首次导入插件不显示,或者报以下未注册`qiun-data-charts`的错误: 402 | > Unknown custom element: < qiun-data-charts > - did you register the component correctly? For recursive components, make sure to provide the "name" option. 403 | * 2、请【重启HBuilderX】或者【重启项目】或者【重启开发者工具】或者【删除APP基座】重新运行,避免缓存问题导致不能显示。 404 | * 3、如果是基于uniapp的vue-cli项目,1、请 npm update 升级uniapp依赖为最新版本;2、请尝试清理node-modules,重新install,还不行就删除项目,再重新install。如果仍然不行,请检查uniapp依赖是否为最新版本,再重试以上步骤。如果仍然不行,请使用【非uni_modules版本】组件,最新非uni_modules版本在码云发布,[点击此处获取](https://gitee.com/uCharts/uCharts/tree/master/qiun-data-charts%EF%BC%88%E9%9D%9Euni-modules%EF%BC%89)。。 405 | * 4、请检查控制台是否有报错或提示信息,如果没有报错,也没有提示信息,并且检查视图中class="charts-box"这个元素的宽高均为0,请修改父元素的css样式或进行下面第4步检查。 406 | * 5、检查父级是否使用了v-show来控制显示。如果页面初始化时组件处于隐藏状态,组件则无法正确获取宽高尺寸,此时需要组件内绑定reshow属性(逻辑应与父级的v-show的逻辑相同),强制重新渲染图表,例如:reshow="父级v-show绑定的事件"。 407 | * 6、如果在微信小程序端开启了canvas2d模式(不能使用真机调试,请直接预览)不显示图表: 408 | * a、请务必在组件上定义canvasId,不能为纯数字、不能为变量、不能重复、尽量长一些。 409 | * b、请检查微信小程序的基础库,修改至2.16.0或者最新版本的基础库。 410 | * c、请检查父元素或父组件是否用v-if来控制显示,如有请改为v-show,并将v-show的逻辑绑定至组件。 411 | - `formatter格式化问题`:无论是uCharts还是ECharts,因为组件不能传递function,所有的formatter均需要变成别名format来定义,并在config-ucharts.js或config-echarts.js配置对应的formatter方法,组件会根据format的值自动替换配置文件中的formatter方法。(参考示例项目pages/format/format.vue) 412 | - `图表抖动问题`:如果开启了animation动画效果,由于组件内开启了chartData和opts的监听,当数据变化时会重新渲染图表,建议整体改变chartData及opts的属性值,而不要通过循环或遍历来改变this实例下的chartData及opts,例如先定义一个临时变量,拼接好数据后再整体赋值。(参考示例项目pages/updata/updata.vue) 413 | - `微信小程序报错Maximum call stack size exceeded问题`:由于组件内开启了chartData和opts的监听,当数据变化时会重新渲染图表,建议整体改变chartData及opts的属性值,而不要通过循环或遍历来改变this实例下的chartData及opts,例如先定义一个临时变量,拼接好数据后再整体赋值。(参考示例项目pages/updata/updata.vue) 414 | - `Loading状态问题`:如不使用uniClinetDB获取数据源,并且需要展示Loading状态,请先清空series,使组件变更为Loading状态,即this.chartData.series=[]即可展示,然后再从服务端获取数据,拼接完成后再传入this.chartData。如果不需要展示Loading状态,则不需要以上步骤,获取到数据,拼接好标准格式后,直接赋值即可。 415 | - `微信小程序图表层级过高问题`:因canvas在微信小程序是原生组件,如果使用自定义tabbar或者自定义导航栏,图表则会超出预期,此时需要给组件的canvas2d传值true来使用type='2d'的功能,开启此模式后,一定要在组件上自定义canvasId,不能为数字,不能动态绑定,要为随机字符串!不能“真机调试”,不能“真机调试”,不能“真机调试”开发者工具显示不正常,图表层级会变高,而正常预览或者发布上线则是正常状态,开发者不必担心,一切以真机预览为准(因微信开发者工具显示不正确,canvas2d这种模式下给调试带来了困难,开发时,可以先用:canvas2d="false"来调试,预览无误后再改成true)。 416 | - `开启canvas2d后图表不显示问题`:开启canvas2d后,需要手动指定canvasId,并且父元素不能含有v-if,否则会导致获取不到dom节点问题,请将v-if改成v-show,更多开启canvas2d不显示问题,请参考示例项目pages/layout/layout.vue文件,对照示例项目修改您的项目。 417 | - `MiniPorgramError U.createEvent is ot a function`:此问题一般是微信小程序开启了canvas2d,并点击了“真机调试导致”,参考上面【微信小程序图表层级过高问题】解决办法,开启2d后,不可以真机调试,只能开发者工具调试或者扫二维码“预览”。 418 | - `在图表上滑动无法使页面滚动问题`:此问题是因为监听了touchstart、touchmove和touchend三个事件,或者开启了disableScroll属性,如果您的图表不需要开启图表内的滚动条功能,请禁用这三个方法的监听,即:ontouch="false"或者:disableScroll="false"即可(此时图表组件默认通过@tap事件来监听点击,可正常显示Tooltip提示窗)。 419 | - `开启滚动条无法拖动图表问题`:此问题正与以上问题相反,是因为禁用了监听touchstart、touchmove和touchend三个事件,请启用这三个方法的监听,即在组件上加入 :ontouch="true" 即可。注意,不要忘记在opts里需要配置enableScroll:true,另外如果需要显示滚动条,需要在xAxis中配置scrollShow:ture,及itemCount(单屏数据密度)数量的配置。 420 | - `开启滚动条后图表两侧有白边问题`:此问题是因为组件上的background为none或者没有指定,请在组件上加入background="#000000"(您的背景色)。如果父元素为图片,尽量不要开启滚动条,此时图表是透明色,可以显示父元素背景图片。 421 | - `开启滚动条后动态打点更新数据滚动条位置问题`:开启滚动条后动态打点,需要把opts中update需要赋值为true,来启用uCharts的updateData方法来更新视图,详见示例项目pages/updata/updata.vue。 422 | - `地图变形问题`:此问题是因为您引用的geojson地图数据的坐标系可能是地球坐标(WGS84)导致,需要开启【是否进行WGS84转墨卡托投影】功能。开启后因大量的数据运算tooltip可能会不跟手,建议自行转换为墨卡托坐标系,可参照源码内function lonlat2mercator()。其他地图数据下载地址:[http://datav.aliyun.com/tools/atlas/](http://datav.aliyun.com/tools/atlas/) 423 | - `支付宝(钉钉)小程序无法点击问题`:请检查支付宝小程序开发者工具中,点击【详情】,在弹出的【项目详情】中【取消】启用小程序基础库 2.0 构建,一定不要勾选此项。 424 | - `uni-simple-router中使用问题`:如果使用uni-simple-router路由插件,H5开启完全路由模式(即h5:{vueRouterDev:true})时,会导致组件内uni.xxx部分方法失效,引发节点获取不正常报错,请使用普通模式即可。 425 | - `Y轴刻度标签数字重复问题`:此问题一般是series数据内数值较小,而Y轴网格数量较多,并且Y轴刻度点显示整数导致。解决方法1,Y轴刻度值保留两位小数,组件上传值 :opts="{yAxis:{data:[{tofix:2}]}}";解决方法2,修改Y轴网格数量为series中的最大值的数量,例如series中最大值为3,那么修改yAxis.splitNumber=3即可;解决方法3,根据Y轴网格数量修改Y轴最大值 :opts="{yAxis:{data:[{max:5}]}}"。 426 | - `柱状图柱子高度不符合预期问题`:此问题是Y轴最小值未默认为0的问题导致,组件上传值 :opts="{yAxis:{data:[{min:0}]}}"即可解决。 427 | - `饼图类百分比改其他文案的问题`:参考示例项目pages/format-u/format-u.vue,在chartData的series中使用format。 428 | 429 | ## [更多常见问题以官方网站【常见问题】为准](http://demo.ucharts.cn) 430 | 431 | ## QQ群号码 432 | ## 请先完整阅读【帮助文档】及【常见问题】3遍,右侧蓝色按钮【示例项目】请看2遍!不看文档不看常见问题进群就问的拒绝回答问题!咨询量太大请理解作者! 433 | - 交流群1:371774600(已满) 434 | - 交流群2:619841586 435 | - 交流群3:955340127(已满) 436 | - 交流群4:641669795 437 | - 口令`uniapp` 438 | 439 | 440 | ## 相关链接 441 | - [DCloud插件市场地址](https://ext.dcloud.net.cn/plugin?id=271) 442 | - [uCharts官网](https://www.ucharts.cn) 443 | - [uCharts码云开源托管地址](https://gitee.com/uCharts/uCharts) [![star](https://gitee.com/uCharts/uCharts/badge/star.svg?theme=gvp)](https://gitee.com/uCharts/uCharts/stargazers) 444 | - [图表组件在项目中的应用 UReport数据报表](https://ext.dcloud.net.cn/plugin?id=4651) 445 | - [ECharts官网](https://echarts.apache.org/zh/index.html) 446 | - [ECharts配置手册](https://echarts.apache.org/zh/option.html) 447 | - [`wkiwi`提供的w-loading组件地址](https://ext.dcloud.net.cn/plugin?id=504) -------------------------------------------------------------------------------- /uni_modules/uni-link/changelog.md: -------------------------------------------------------------------------------- 1 | ## 1.0.0(2021-11-19) 2 | - 优化 组件UI,并提供设计资源,详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource) 3 | - 文档迁移,详见:[https://uniapp.dcloud.io/component/uniui/uni-link](https://uniapp.dcloud.io/component/uniui/uni-link) 4 | ## 1.1.7(2021-11-08) 5 | ## 0.0.7(2021-09-03) 6 | - 修复 在 nvue 下不显示的 bug 7 | ## 0.0.6(2021-07-30) 8 | - 新增 支持自定义插槽 9 | ## 0.0.5(2021-06-21) 10 | - 新增 download 属性,H5平台下载文件名 11 | ## 0.0.4(2021-05-12) 12 | - 新增 组件示例地址 13 | ## 0.0.3(2021-03-09) 14 | - 新增 href 属性支持 tel:|mailto: 15 | 16 | ## 0.0.2(2021-02-05) 17 | - 调整为uni_modules目录规范 18 | -------------------------------------------------------------------------------- /uni_modules/uni-link/components/uni-link/uni-link.vue: -------------------------------------------------------------------------------- 1 | 20 | 21 | 117 | 118 | 129 | -------------------------------------------------------------------------------- /uni_modules/uni-link/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "id": "uni-link", 3 | "displayName": "uni-link 超链接", 4 | "version": "1.0.0", 5 | "description": "uni-link是一个外部网页超链接组件,在小程序内复制url,在app内打开外部浏览器,在h5端打", 6 | "keywords": [ 7 | "uni-ui", 8 | "uniui", 9 | "link", 10 | "超链接", 11 | "" 12 | ], 13 | "repository": "https://github.com/dcloudio/uni-ui", 14 | "engines": { 15 | "HBuilderX": "" 16 | }, 17 | "directories": { 18 | "example": "../../temps/example_temps" 19 | }, 20 | "dcloudext": { 21 | "category": [ 22 | "前端组件", 23 | "通用组件" 24 | ], 25 | "sale": { 26 | "regular": { 27 | "price": "0.00" 28 | }, 29 | "sourcecode": { 30 | "price": "0.00" 31 | } 32 | }, 33 | "contact": { 34 | "qq": "" 35 | }, 36 | "declaration": { 37 | "ads": "无", 38 | "data": "无", 39 | "permissions": "无" 40 | }, 41 | "npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui" 42 | }, 43 | "uni_modules": { 44 | "dependencies": ["uni-scss"], 45 | "encrypt": [], 46 | "platforms": { 47 | "cloud": { 48 | "tcb": "y", 49 | "aliyun": "y" 50 | }, 51 | "client": { 52 | "App": { 53 | "app-vue": "y", 54 | "app-nvue": "y" 55 | }, 56 | "H5-mobile": { 57 | "Safari": "y", 58 | "Android Browser": "y", 59 | "微信浏览器(Android)": "y", 60 | "QQ浏览器(Android)": "y" 61 | }, 62 | "H5-pc": { 63 | "Chrome": "y", 64 | "IE": "y", 65 | "Edge": "y", 66 | "Firefox": "y", 67 | "Safari": "y" 68 | }, 69 | "小程序": { 70 | "微信": "y", 71 | "阿里": "y", 72 | "百度": "y", 73 | "字节跳动": "y", 74 | "QQ": "y" 75 | }, 76 | "快应用": { 77 | "华为": "y", 78 | "联盟": "y" 79 | }, 80 | "Vue": { 81 | "vue2": "y", 82 | "vue3": "y" 83 | } 84 | } 85 | } 86 | } 87 | } -------------------------------------------------------------------------------- /uni_modules/uni-link/readme.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | ## Link 链接 4 | > **组件名:uni-link** 5 | > 代码块: `uLink` 6 | 7 | 8 | uni-link是一个外部网页超链接组件,在小程序内复制url,在app内打开外部浏览器,在h5端打开新网页。 9 | 10 | ### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-link) 11 | #### 如使用过程中有任何问题,或者您对uni-ui有一些好的建议,欢迎加入 uni-ui 交流群:871950839 -------------------------------------------------------------------------------- /uni_modules/uni-scss/changelog.md: -------------------------------------------------------------------------------- 1 | ## 1.0.3(2022-01-21) 2 | - 优化 组件示例 3 | ## 1.0.2(2021-11-22) 4 | - 修复 / 符号在 vue 不同版本兼容问题引起的报错问题 5 | ## 1.0.1(2021-11-22) 6 | - 修复 vue3中scss语法兼容问题 7 | ## 1.0.0(2021-11-18) 8 | - init 9 | -------------------------------------------------------------------------------- /uni_modules/uni-scss/index.scss: -------------------------------------------------------------------------------- 1 | @import './styles/index.scss'; 2 | -------------------------------------------------------------------------------- /uni_modules/uni-scss/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "id": "uni-scss", 3 | "displayName": "uni-scss 辅助样式", 4 | "version": "1.0.3", 5 | "description": "uni-sass是uni-ui提供的一套全局样式 ,通过一些简单的类名和sass变量,实现简单的页面布局操作,比如颜色、边距、圆角等。", 6 | "keywords": [ 7 | "uni-scss", 8 | "uni-ui", 9 | "辅助样式" 10 | ], 11 | "repository": "https://github.com/dcloudio/uni-ui", 12 | "engines": { 13 | "HBuilderX": "^3.1.0" 14 | }, 15 | "dcloudext": { 16 | "category": [ 17 | "JS SDK", 18 | "通用 SDK" 19 | ], 20 | "sale": { 21 | "regular": { 22 | "price": "0.00" 23 | }, 24 | "sourcecode": { 25 | "price": "0.00" 26 | } 27 | }, 28 | "contact": { 29 | "qq": "" 30 | }, 31 | "declaration": { 32 | "ads": "无", 33 | "data": "无", 34 | "permissions": "无" 35 | }, 36 | "npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui" 37 | }, 38 | "uni_modules": { 39 | "dependencies": [], 40 | "encrypt": [], 41 | "platforms": { 42 | "cloud": { 43 | "tcb": "y", 44 | "aliyun": "y" 45 | }, 46 | "client": { 47 | "App": { 48 | "app-vue": "y", 49 | "app-nvue": "u" 50 | }, 51 | "H5-mobile": { 52 | "Safari": "y", 53 | "Android Browser": "y", 54 | "微信浏览器(Android)": "y", 55 | "QQ浏览器(Android)": "y" 56 | }, 57 | "H5-pc": { 58 | "Chrome": "y", 59 | "IE": "y", 60 | "Edge": "y", 61 | "Firefox": "y", 62 | "Safari": "y" 63 | }, 64 | "小程序": { 65 | "微信": "y", 66 | "阿里": "y", 67 | "百度": "y", 68 | "字节跳动": "y", 69 | "QQ": "y" 70 | }, 71 | "快应用": { 72 | "华为": "n", 73 | "联盟": "n" 74 | }, 75 | "Vue": { 76 | "vue2": "y", 77 | "vue3": "y" 78 | } 79 | } 80 | } 81 | } 82 | } 83 | -------------------------------------------------------------------------------- /uni_modules/uni-scss/readme.md: -------------------------------------------------------------------------------- 1 | `uni-sass` 是 `uni-ui`提供的一套全局样式 ,通过一些简单的类名和`sass`变量,实现简单的页面布局操作,比如颜色、边距、圆角等。 2 | 3 | ### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-sass) 4 | #### 如使用过程中有任何问题,或者您对uni-ui有一些好的建议,欢迎加入 uni-ui 交流群:871950839 -------------------------------------------------------------------------------- /uni_modules/uni-scss/styles/index.scss: -------------------------------------------------------------------------------- 1 | @import './setting/_variables.scss'; 2 | @import './setting/_border.scss'; 3 | @import './setting/_color.scss'; 4 | @import './setting/_space.scss'; 5 | @import './setting/_radius.scss'; 6 | @import './setting/_text.scss'; 7 | @import './setting/_styles.scss'; 8 | -------------------------------------------------------------------------------- /uni_modules/uni-scss/styles/setting/_border.scss: -------------------------------------------------------------------------------- 1 | .uni-border { 2 | border: 1px $uni-border-1 solid; 3 | } -------------------------------------------------------------------------------- /uni_modules/uni-scss/styles/setting/_color.scss: -------------------------------------------------------------------------------- 1 | 2 | // TODO 暂时不需要 class ,需要用户使用变量实现 ,如果使用类名其实并不推荐 3 | // @mixin get-styles($k,$c) { 4 | // @if $k == size or $k == weight{ 5 | // font-#{$k}:#{$c} 6 | // }@else{ 7 | // #{$k}:#{$c} 8 | // } 9 | // } 10 | $uni-ui-color:( 11 | // 主色 12 | primary: $uni-primary, 13 | primary-disable: $uni-primary-disable, 14 | primary-light: $uni-primary-light, 15 | // 辅助色 16 | success: $uni-success, 17 | success-disable: $uni-success-disable, 18 | success-light: $uni-success-light, 19 | warning: $uni-warning, 20 | warning-disable: $uni-warning-disable, 21 | warning-light: $uni-warning-light, 22 | error: $uni-error, 23 | error-disable: $uni-error-disable, 24 | error-light: $uni-error-light, 25 | info: $uni-info, 26 | info-disable: $uni-info-disable, 27 | info-light: $uni-info-light, 28 | // 中性色 29 | main-color: $uni-main-color, 30 | base-color: $uni-base-color, 31 | secondary-color: $uni-secondary-color, 32 | extra-color: $uni-extra-color, 33 | // 背景色 34 | bg-color: $uni-bg-color, 35 | // 边框颜色 36 | border-1: $uni-border-1, 37 | border-2: $uni-border-2, 38 | border-3: $uni-border-3, 39 | border-4: $uni-border-4, 40 | // 黑色 41 | black:$uni-black, 42 | // 白色 43 | white:$uni-white, 44 | // 透明 45 | transparent:$uni-transparent 46 | ) !default; 47 | @each $key, $child in $uni-ui-color { 48 | .uni-#{"" + $key} { 49 | color: $child; 50 | } 51 | .uni-#{"" + $key}-bg { 52 | background-color: $child; 53 | } 54 | } 55 | .uni-shadow-sm { 56 | box-shadow: $uni-shadow-sm; 57 | } 58 | .uni-shadow-base { 59 | box-shadow: $uni-shadow-base; 60 | } 61 | .uni-shadow-lg { 62 | box-shadow: $uni-shadow-lg; 63 | } 64 | .uni-mask { 65 | background-color:$uni-mask; 66 | } 67 | -------------------------------------------------------------------------------- /uni_modules/uni-scss/styles/setting/_radius.scss: -------------------------------------------------------------------------------- 1 | @mixin radius($r,$d:null ,$important: false){ 2 | $radius-value:map-get($uni-radius, $r) if($important, !important, null); 3 | // Key exists within the $uni-radius variable 4 | @if (map-has-key($uni-radius, $r) and $d){ 5 | @if $d == t { 6 | border-top-left-radius:$radius-value; 7 | border-top-right-radius:$radius-value; 8 | }@else if $d == r { 9 | border-top-right-radius:$radius-value; 10 | border-bottom-right-radius:$radius-value; 11 | }@else if $d == b { 12 | border-bottom-left-radius:$radius-value; 13 | border-bottom-right-radius:$radius-value; 14 | }@else if $d == l { 15 | border-top-left-radius:$radius-value; 16 | border-bottom-left-radius:$radius-value; 17 | }@else if $d == tl { 18 | border-top-left-radius:$radius-value; 19 | }@else if $d == tr { 20 | border-top-right-radius:$radius-value; 21 | }@else if $d == br { 22 | border-bottom-right-radius:$radius-value; 23 | }@else if $d == bl { 24 | border-bottom-left-radius:$radius-value; 25 | } 26 | }@else{ 27 | border-radius:$radius-value; 28 | } 29 | } 30 | 31 | @each $key, $child in $uni-radius { 32 | @if($key){ 33 | .uni-radius-#{"" + $key} { 34 | @include radius($key) 35 | } 36 | }@else{ 37 | .uni-radius { 38 | @include radius($key) 39 | } 40 | } 41 | } 42 | 43 | @each $direction in t, r, b, l,tl, tr, br, bl { 44 | @each $key, $child in $uni-radius { 45 | @if($key){ 46 | .uni-radius-#{"" + $direction}-#{"" + $key} { 47 | @include radius($key,$direction,false) 48 | } 49 | }@else{ 50 | .uni-radius-#{$direction} { 51 | @include radius($key,$direction,false) 52 | } 53 | } 54 | } 55 | } 56 | -------------------------------------------------------------------------------- /uni_modules/uni-scss/styles/setting/_space.scss: -------------------------------------------------------------------------------- 1 | 2 | @mixin fn($space,$direction,$size,$n) { 3 | @if $n { 4 | #{$space}-#{$direction}: #{$size*$uni-space-root}px 5 | } @else { 6 | #{$space}-#{$direction}: #{-$size*$uni-space-root}px 7 | } 8 | } 9 | @mixin get-styles($direction,$i,$space,$n){ 10 | @if $direction == t { 11 | @include fn($space, top,$i,$n); 12 | } 13 | @if $direction == r { 14 | @include fn($space, right,$i,$n); 15 | } 16 | @if $direction == b { 17 | @include fn($space, bottom,$i,$n); 18 | } 19 | @if $direction == l { 20 | @include fn($space, left,$i,$n); 21 | } 22 | @if $direction == x { 23 | @include fn($space, left,$i,$n); 24 | @include fn($space, right,$i,$n); 25 | } 26 | @if $direction == y { 27 | @include fn($space, top,$i,$n); 28 | @include fn($space, bottom,$i,$n); 29 | } 30 | @if $direction == a { 31 | @if $n { 32 | #{$space}:#{$i*$uni-space-root}px; 33 | } @else { 34 | #{$space}:#{-$i*$uni-space-root}px; 35 | } 36 | } 37 | } 38 | 39 | @each $orientation in m,p { 40 | $space: margin; 41 | @if $orientation == m { 42 | $space: margin; 43 | } @else { 44 | $space: padding; 45 | } 46 | @for $i from 0 through 16 { 47 | @each $direction in t, r, b, l, x, y, a { 48 | .uni-#{$orientation}#{$direction}-#{$i} { 49 | @include get-styles($direction,$i,$space,true); 50 | } 51 | .uni-#{$orientation}#{$direction}-n#{$i} { 52 | @include get-styles($direction,$i,$space,false); 53 | } 54 | } 55 | } 56 | } -------------------------------------------------------------------------------- /uni_modules/uni-scss/styles/setting/_styles.scss: -------------------------------------------------------------------------------- 1 | /* #ifndef APP-NVUE */ 2 | 3 | $-color-white:#fff; 4 | $-color-black:#000; 5 | @mixin base-style($color) { 6 | color: #fff; 7 | background-color: $color; 8 | border-color: mix($-color-black, $color, 8%); 9 | &:not([hover-class]):active { 10 | background: mix($-color-black, $color, 10%); 11 | border-color: mix($-color-black, $color, 20%); 12 | color: $-color-white; 13 | outline: none; 14 | } 15 | } 16 | @mixin is-color($color) { 17 | @include base-style($color); 18 | &[loading] { 19 | @include base-style($color); 20 | &::before { 21 | margin-right:5px; 22 | } 23 | } 24 | &[disabled] { 25 | &, 26 | &[loading], 27 | &:not([hover-class]):active { 28 | color: $-color-white; 29 | border-color: mix(darken($color,10%), $-color-white); 30 | background-color: mix($color, $-color-white); 31 | } 32 | } 33 | 34 | } 35 | @mixin base-plain-style($color) { 36 | color:$color; 37 | background-color: mix($-color-white, $color, 90%); 38 | border-color: mix($-color-white, $color, 70%); 39 | &:not([hover-class]):active { 40 | background: mix($-color-white, $color, 80%); 41 | color: $color; 42 | outline: none; 43 | border-color: mix($-color-white, $color, 50%); 44 | } 45 | } 46 | @mixin is-plain($color){ 47 | &[plain] { 48 | @include base-plain-style($color); 49 | &[loading] { 50 | @include base-plain-style($color); 51 | &::before { 52 | margin-right:5px; 53 | } 54 | } 55 | &[disabled] { 56 | &, 57 | &:active { 58 | color: mix($-color-white, $color, 40%); 59 | background-color: mix($-color-white, $color, 90%); 60 | border-color: mix($-color-white, $color, 80%); 61 | } 62 | } 63 | } 64 | } 65 | 66 | 67 | .uni-btn { 68 | margin: 5px; 69 | color: #393939; 70 | border:1px solid #ccc; 71 | font-size: 16px; 72 | font-weight: 200; 73 | background-color: #F9F9F9; 74 | // TODO 暂时处理边框隐藏一边的问题 75 | overflow: visible; 76 | &::after{ 77 | border: none; 78 | } 79 | 80 | &:not([type]),&[type=default] { 81 | color: #999; 82 | &[loading] { 83 | background: none; 84 | &::before { 85 | margin-right:5px; 86 | } 87 | } 88 | 89 | 90 | 91 | &[disabled]{ 92 | color: mix($-color-white, #999, 60%); 93 | &, 94 | &[loading], 95 | &:active { 96 | color: mix($-color-white, #999, 60%); 97 | background-color: mix($-color-white,$-color-black , 98%); 98 | border-color: mix($-color-white, #999, 85%); 99 | } 100 | } 101 | 102 | &[plain] { 103 | color: #999; 104 | background: none; 105 | border-color: $uni-border-1; 106 | &:not([hover-class]):active { 107 | background: none; 108 | color: mix($-color-white, $-color-black, 80%); 109 | border-color: mix($-color-white, $-color-black, 90%); 110 | outline: none; 111 | } 112 | &[disabled]{ 113 | &, 114 | &[loading], 115 | &:active { 116 | background: none; 117 | color: mix($-color-white, #999, 60%); 118 | border-color: mix($-color-white, #999, 85%); 119 | } 120 | } 121 | } 122 | } 123 | 124 | &:not([hover-class]):active { 125 | color: mix($-color-white, $-color-black, 50%); 126 | } 127 | 128 | &[size=mini] { 129 | font-size: 16px; 130 | font-weight: 200; 131 | border-radius: 8px; 132 | } 133 | 134 | 135 | 136 | &.uni-btn-small { 137 | font-size: 14px; 138 | } 139 | &.uni-btn-mini { 140 | font-size: 12px; 141 | } 142 | 143 | &.uni-btn-radius { 144 | border-radius: 999px; 145 | } 146 | &[type=primary] { 147 | @include is-color($uni-primary); 148 | @include is-plain($uni-primary) 149 | } 150 | &[type=success] { 151 | @include is-color($uni-success); 152 | @include is-plain($uni-success) 153 | } 154 | &[type=error] { 155 | @include is-color($uni-error); 156 | @include is-plain($uni-error) 157 | } 158 | &[type=warning] { 159 | @include is-color($uni-warning); 160 | @include is-plain($uni-warning) 161 | } 162 | &[type=info] { 163 | @include is-color($uni-info); 164 | @include is-plain($uni-info) 165 | } 166 | } 167 | /* #endif */ 168 | -------------------------------------------------------------------------------- /uni_modules/uni-scss/styles/setting/_text.scss: -------------------------------------------------------------------------------- 1 | @mixin get-styles($k,$c) { 2 | @if $k == size or $k == weight{ 3 | font-#{$k}:#{$c} 4 | }@else{ 5 | #{$k}:#{$c} 6 | } 7 | } 8 | 9 | @each $key, $child in $uni-headings { 10 | /* #ifndef APP-NVUE */ 11 | .uni-#{$key} { 12 | @each $k, $c in $child { 13 | @include get-styles($k,$c) 14 | } 15 | } 16 | /* #endif */ 17 | /* #ifdef APP-NVUE */ 18 | .container .uni-#{$key} { 19 | @each $k, $c in $child { 20 | @include get-styles($k,$c) 21 | } 22 | } 23 | /* #endif */ 24 | } 25 | -------------------------------------------------------------------------------- /uni_modules/uni-scss/styles/setting/_variables.scss: -------------------------------------------------------------------------------- 1 | // @use "sass:math"; 2 | @import '../tools/functions.scss'; 3 | // 间距基础倍数 4 | $uni-space-root: 2 !default; 5 | // 边框半径默认值 6 | $uni-radius-root:5px !default; 7 | $uni-radius: () !default; 8 | // 边框半径断点 9 | $uni-radius: map-deep-merge( 10 | ( 11 | 0: 0, 12 | // TODO 当前版本暂时不支持 sm 属性 13 | // 'sm': math.div($uni-radius-root, 2), 14 | null: $uni-radius-root, 15 | 'lg': $uni-radius-root * 2, 16 | 'xl': $uni-radius-root * 6, 17 | 'pill': 9999px, 18 | 'circle': 50% 19 | ), 20 | $uni-radius 21 | ); 22 | // 字体家族 23 | $body-font-family: 'Roboto', sans-serif !default; 24 | // 文本 25 | $heading-font-family: $body-font-family !default; 26 | $uni-headings: () !default; 27 | $letterSpacing: -0.01562em; 28 | $uni-headings: map-deep-merge( 29 | ( 30 | 'h1': ( 31 | size: 32px, 32 | weight: 300, 33 | line-height: 50px, 34 | // letter-spacing:-0.01562em 35 | ), 36 | 'h2': ( 37 | size: 28px, 38 | weight: 300, 39 | line-height: 40px, 40 | // letter-spacing: -0.00833em 41 | ), 42 | 'h3': ( 43 | size: 24px, 44 | weight: 400, 45 | line-height: 32px, 46 | // letter-spacing: normal 47 | ), 48 | 'h4': ( 49 | size: 20px, 50 | weight: 400, 51 | line-height: 30px, 52 | // letter-spacing: 0.00735em 53 | ), 54 | 'h5': ( 55 | size: 16px, 56 | weight: 400, 57 | line-height: 24px, 58 | // letter-spacing: normal 59 | ), 60 | 'h6': ( 61 | size: 14px, 62 | weight: 500, 63 | line-height: 18px, 64 | // letter-spacing: 0.0125em 65 | ), 66 | 'subtitle': ( 67 | size: 12px, 68 | weight: 400, 69 | line-height: 20px, 70 | // letter-spacing: 0.00937em 71 | ), 72 | 'body': ( 73 | font-size: 14px, 74 | font-weight: 400, 75 | line-height: 22px, 76 | // letter-spacing: 0.03125em 77 | ), 78 | 'caption': ( 79 | 'size': 12px, 80 | 'weight': 400, 81 | 'line-height': 20px, 82 | // 'letter-spacing': 0.03333em, 83 | // 'text-transform': false 84 | ) 85 | ), 86 | $uni-headings 87 | ); 88 | 89 | 90 | 91 | // 主色 92 | $uni-primary: #2979ff !default; 93 | $uni-primary-disable:lighten($uni-primary,20%) !default; 94 | $uni-primary-light: lighten($uni-primary,25%) !default; 95 | 96 | // 辅助色 97 | // 除了主色外的场景色,需要在不同的场景中使用(例如危险色表示危险的操作)。 98 | $uni-success: #18bc37 !default; 99 | $uni-success-disable:lighten($uni-success,20%) !default; 100 | $uni-success-light: lighten($uni-success,25%) !default; 101 | 102 | $uni-warning: #f3a73f !default; 103 | $uni-warning-disable:lighten($uni-warning,20%) !default; 104 | $uni-warning-light: lighten($uni-warning,25%) !default; 105 | 106 | $uni-error: #e43d33 !default; 107 | $uni-error-disable:lighten($uni-error,20%) !default; 108 | $uni-error-light: lighten($uni-error,25%) !default; 109 | 110 | $uni-info: #8f939c !default; 111 | $uni-info-disable:lighten($uni-info,20%) !default; 112 | $uni-info-light: lighten($uni-info,25%) !default; 113 | 114 | // 中性色 115 | // 中性色用于文本、背景和边框颜色。通过运用不同的中性色,来表现层次结构。 116 | $uni-main-color: #3a3a3a !default; // 主要文字 117 | $uni-base-color: #6a6a6a !default; // 常规文字 118 | $uni-secondary-color: #909399 !default; // 次要文字 119 | $uni-extra-color: #c7c7c7 !default; // 辅助说明 120 | 121 | // 边框颜色 122 | $uni-border-1: #F0F0F0 !default; 123 | $uni-border-2: #EDEDED !default; 124 | $uni-border-3: #DCDCDC !default; 125 | $uni-border-4: #B9B9B9 !default; 126 | 127 | // 常规色 128 | $uni-black: #000000 !default; 129 | $uni-white: #ffffff !default; 130 | $uni-transparent: rgba($color: #000000, $alpha: 0) !default; 131 | 132 | // 背景色 133 | $uni-bg-color: #f7f7f7 !default; 134 | 135 | /* 水平间距 */ 136 | $uni-spacing-sm: 8px !default; 137 | $uni-spacing-base: 15px !default; 138 | $uni-spacing-lg: 30px !default; 139 | 140 | // 阴影 141 | $uni-shadow-sm:0 0 5px rgba($color: #d8d8d8, $alpha: 0.5) !default; 142 | $uni-shadow-base:0 1px 8px 1px rgba($color: #a5a5a5, $alpha: 0.2) !default; 143 | $uni-shadow-lg:0px 1px 10px 2px rgba($color: #a5a4a4, $alpha: 0.5) !default; 144 | 145 | // 蒙版 146 | $uni-mask: rgba($color: #000000, $alpha: 0.4) !default; 147 | -------------------------------------------------------------------------------- /uni_modules/uni-scss/styles/tools/functions.scss: -------------------------------------------------------------------------------- 1 | // 合并 map 2 | @function map-deep-merge($parent-map, $child-map){ 3 | $result: $parent-map; 4 | @each $key, $child in $child-map { 5 | $parent-has-key: map-has-key($result, $key); 6 | $parent-value: map-get($result, $key); 7 | $parent-type: type-of($parent-value); 8 | $child-type: type-of($child); 9 | $parent-is-map: $parent-type == map; 10 | $child-is-map: $child-type == map; 11 | 12 | @if (not $parent-has-key) or ($parent-type != $child-type) or (not ($parent-is-map and $child-is-map)){ 13 | $result: map-merge($result, ( $key: $child )); 14 | }@else { 15 | $result: map-merge($result, ( $key: map-deep-merge($parent-value, $child) )); 16 | } 17 | } 18 | @return $result; 19 | }; 20 | -------------------------------------------------------------------------------- /uni_modules/uni-scss/theme.scss: -------------------------------------------------------------------------------- 1 | // 间距基础倍数 2 | $uni-space-root: 2; 3 | // 边框半径默认值 4 | $uni-radius-root:5px; 5 | // 主色 6 | $uni-primary: #2979ff; 7 | // 辅助色 8 | $uni-success: #4cd964; 9 | // 警告色 10 | $uni-warning: #f0ad4e; 11 | // 错误色 12 | $uni-error: #dd524d; 13 | // 描述色 14 | $uni-info: #909399; 15 | // 中性色 16 | $uni-main-color: #303133; 17 | $uni-base-color: #606266; 18 | $uni-secondary-color: #909399; 19 | $uni-extra-color: #C0C4CC; 20 | // 背景色 21 | $uni-bg-color: #f5f5f5; 22 | // 边框颜色 23 | $uni-border-1: #DCDFE6; 24 | $uni-border-2: #E4E7ED; 25 | $uni-border-3: #EBEEF5; 26 | $uni-border-4: #F2F6FC; 27 | 28 | // 常规色 29 | $uni-black: #000000; 30 | $uni-white: #ffffff; 31 | $uni-transparent: rgba($color: #000000, $alpha: 0); 32 | -------------------------------------------------------------------------------- /uni_modules/uni-scss/variables.scss: -------------------------------------------------------------------------------- 1 | @import './styles/setting/_variables.scss'; 2 | // 间距基础倍数 3 | $uni-space-root: 2; 4 | // 边框半径默认值 5 | $uni-radius-root:5px; 6 | 7 | // 主色 8 | $uni-primary: #2979ff; 9 | $uni-primary-disable:mix(#fff,$uni-primary,50%); 10 | $uni-primary-light: mix(#fff,$uni-primary,80%); 11 | 12 | // 辅助色 13 | // 除了主色外的场景色,需要在不同的场景中使用(例如危险色表示危险的操作)。 14 | $uni-success: #18bc37; 15 | $uni-success-disable:mix(#fff,$uni-success,50%); 16 | $uni-success-light: mix(#fff,$uni-success,80%); 17 | 18 | $uni-warning: #f3a73f; 19 | $uni-warning-disable:mix(#fff,$uni-warning,50%); 20 | $uni-warning-light: mix(#fff,$uni-warning,80%); 21 | 22 | $uni-error: #e43d33; 23 | $uni-error-disable:mix(#fff,$uni-error,50%); 24 | $uni-error-light: mix(#fff,$uni-error,80%); 25 | 26 | $uni-info: #8f939c; 27 | $uni-info-disable:mix(#fff,$uni-info,50%); 28 | $uni-info-light: mix(#fff,$uni-info,80%); 29 | 30 | // 中性色 31 | // 中性色用于文本、背景和边框颜色。通过运用不同的中性色,来表现层次结构。 32 | $uni-main-color: #3a3a3a; // 主要文字 33 | $uni-base-color: #6a6a6a; // 常规文字 34 | $uni-secondary-color: #909399; // 次要文字 35 | $uni-extra-color: #c7c7c7; // 辅助说明 36 | 37 | // 边框颜色 38 | $uni-border-1: #F0F0F0; 39 | $uni-border-2: #EDEDED; 40 | $uni-border-3: #DCDCDC; 41 | $uni-border-4: #B9B9B9; 42 | 43 | // 常规色 44 | $uni-black: #000000; 45 | $uni-white: #ffffff; 46 | $uni-transparent: rgba($color: #000000, $alpha: 0); 47 | 48 | // 背景色 49 | $uni-bg-color: #f7f7f7; 50 | 51 | /* 水平间距 */ 52 | $uni-spacing-sm: 8px; 53 | $uni-spacing-base: 15px; 54 | $uni-spacing-lg: 30px; 55 | 56 | // 阴影 57 | $uni-shadow-sm:0 0 5px rgba($color: #d8d8d8, $alpha: 0.5); 58 | $uni-shadow-base:0 1px 8px 1px rgba($color: #a5a5a5, $alpha: 0.2); 59 | $uni-shadow-lg:0px 1px 10px 2px rgba($color: #a5a4a4, $alpha: 0.5); 60 | 61 | // 蒙版 62 | $uni-mask: rgba($color: #000000, $alpha: 0.4); 63 | -------------------------------------------------------------------------------- /utils/api.js: -------------------------------------------------------------------------------- 1 | import store from '../store/index.js' 2 | const http = uni.$u.http 3 | let getQLConfig = () => { 4 | return { 5 | header: { 6 | 'Authorization': `Bearer ${store.state.QLInfo.token}` 7 | } 8 | } 9 | } 10 | let getJDConfig = (cookie) => { 11 | return { 12 | header: { 13 | "user-agent": "jdapp;iPhone;9.4.4;14.3;network/4g;Mozilla/5.0 (iPhone; CPU iPhone OS 14_3 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Mobile/15E148;supportJDSHWK/1", 14 | 'Cookie': cookie 15 | }, 16 | } 17 | } 18 | let getJXConfig = (cookie) => { 19 | return { 20 | header: { 21 | "Referer": "https://st.jingxi.com/", 22 | "user-agent": "jdapp;iPhone;9.4.4;14.3;network/4g;Mozilla/5.0 (iPhone; CPU iPhone OS 14_3 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Mobile/15E148;supportJDSHWK/1", 23 | 'Cookie': cookie 24 | }, 25 | } 26 | } 27 | // 青龙相关请求 28 | export const ql = { 29 | get: { 30 | 31 | list: (type) => http.get(`${store.state.QLInfo.serverUrl}/api/${type}`, 32 | getQLConfig() 33 | ), 34 | cronLog: (cronId) => http.get(`${store.state.QLInfo.serverUrl}/api/crons/${cronId}/log`, 35 | getQLConfig() 36 | ), 37 | config: () => http.get(`${store.state.QLInfo.serverUrl}/api/configs/config.sh`, 38 | getQLConfig() 39 | ), 40 | user: () => http.get(`${store.state.QLInfo.serverUrl}/api/user`, 41 | getQLConfig() 42 | ) 43 | }, 44 | post: { 45 | login: (data) => http.post(`${store.state.QLInfo.serverUrl}/api/user/login`, data), 46 | item: (data, type) => http.post(`${store.state.QLInfo.serverUrl}/api/${type}`, data, 47 | getQLConfig() 48 | ), 49 | config: (data) => http.post(`${store.state.QLInfo.serverUrl}/api/configs/save`, data, getQLConfig()) 50 | }, 51 | put: { 52 | two_step_login: (data) => http.put(`${store.state.QLInfo.serverUrl}/api/user/two-factor/login`, data), 53 | item: (info, type) => http.put(`${store.state.QLInfo.serverUrl}/api/${type}`, { 54 | ...info 55 | }, 56 | getQLConfig() 57 | ), 58 | status: (itemId, type, status) => http.put(`${store.state.QLInfo.serverUrl}/api/${type}/${status}`, [ 59 | itemId 60 | ], 61 | getQLConfig() 62 | ) 63 | }, 64 | delete: { 65 | item: (data, type) => http.delete(`${store.state.QLInfo.serverUrl}/api/${type}`, data, 66 | getQLConfig() 67 | ) 68 | } 69 | } 70 | export const app = { 71 | get: { 72 | checkUpdate: () => http.get('https://api.github.com/repos/Redcker/RCJD/releases', { 73 | custom: { 74 | noloading: true, 75 | toast: false 76 | } 77 | }) 78 | } 79 | } 80 | 81 | 82 | export const jd = { 83 | get: { 84 | info: (cookie) => http.get('https://me-api.jd.com/user_new/info/GetJDUserInfoUnion', getJDConfig(cookie)), 85 | } 86 | } 87 | export const jx = { 88 | get: { 89 | beanCount: (cookie) => http.get('https://m.jingxi.com/activeapi/querybeanamount?sceneval=2&g_login_type=1', 90 | getJXConfig(cookie)), 91 | beanDetail : (cookie) => http.get('https://m.jingxi.com/activeapi/queryuserjingdoudetail?sceneval=2&g_login_type=1&g_ty=ls&pagesize=10&type=16') 92 | } 93 | } 94 | -------------------------------------------------------------------------------- /utils/jd.js: -------------------------------------------------------------------------------- 1 | import { jd } from "./api.js" 2 | async function getUserInfoFromCookie(cookie) { 3 | let result = null 4 | await jd.get.info(cookie).then(res=>{ 5 | result = res 6 | }) 7 | let userInfo = result.userInfo.baseInfo 8 | userInfo['xbKeepScore'] = result.userInfo.xbKeepScore 9 | userInfo['xbScore'] = result.userInfo.xbScore 10 | userInfo['beanNum'] = result.assetInfo.beanNum 11 | userInfo['redBalance'] = result.assetInfo.redBalance 12 | return userInfo 13 | } 14 | export { 15 | getUserInfoFromCookie 16 | } 17 | -------------------------------------------------------------------------------- /utils/ql.js: -------------------------------------------------------------------------------- 1 | import store from '../store/index.js' 2 | 3 | function checkQLLogin() { 4 | let QLUserInfo = uni.getStorageSync('QLUserInfo') 5 | if (!QLUserInfo) { 6 | return 7 | } 8 | // 拉取用户信息,测试token是否过期 9 | uni.request({ 10 | url: `${store.state.QLInfo.serverUrl}/api/user`, 11 | header: { 12 | 'Authorization': `Bearer ${store.state.QLInfo.token}` 13 | }, 14 | success: (res) => { 15 | // 青龙登录失效,自动登录 16 | if (res.statusCode !== 200) { 17 | uni.request({ 18 | url: `${store.state.QLInfo.serverUrl}/api/user/login`, 19 | method: 'POST', 20 | dataType: 'json', 21 | data: QLUserInfo, 22 | success: (res) => { 23 | store.commit('updateQLToken',res.data.data.token) 24 | } 25 | }) 26 | } 27 | }, 28 | fail: () => { 29 | uni.$u.toast('青龙链接失败') 30 | } 31 | }) 32 | } 33 | export { 34 | checkQLLogin 35 | } 36 | -------------------------------------------------------------------------------- /utils/request.js: -------------------------------------------------------------------------------- 1 | // 此vm参数为页面的实例,可以通过它引用vuex中的变量 2 | module.exports = (vm) => { 3 | // 初始化请求配置 4 | uni.$u.http.setConfig((config) => { 5 | /* config 为默认全局配置*/ 6 | config.dataType = 'json'; 7 | config.timeout = 6000; 8 | config.withCredentials = false; 9 | return config 10 | }) 11 | 12 | // 请求拦截 13 | uni.$u.http.interceptors.request.use((config) => { // 可使用async await 做异步操作 14 | // 初始化请求拦截器时,会执行此方法,此时data为undefined,赋予默认{} 15 | config.header = { 16 | ...config.header, 17 | } 18 | config.data = config.data || {} 19 | const custom = config.custom 20 | if (!custom.noloading) { 21 | uni.showLoading({ 22 | title: '请求中...' 23 | }) 24 | } 25 | return config 26 | }, config => { // 可使用async await 做异步操作 27 | return Promise.reject(config) 28 | }) 29 | 30 | // 响应拦截 31 | uni.$u.http.interceptors.response.use((response) => { 32 | uni.hideLoading() 33 | const data = response.data || response 34 | // 自定义参数 35 | const custom = response.config?.custom 36 | if (data.code && data.code !== 200) { 37 | if (custom.toast !== false) { 38 | uni.$u.toast(data.message) 39 | } 40 | return Promise.reject(data) 41 | } 42 | return data.data || data 43 | }, (response) => { 44 | uni.hideLoading() 45 | if (response.config.custom.toast) { 46 | uni.$u.toast(response.data.message || '服务器错误') 47 | } 48 | 49 | return Promise.reject(response) 50 | }) 51 | } 52 | --------------------------------------------------------------------------------