晋能app

.hbuilderx/launch.json

@@ -0,0 +1,16 @@
+{ // launch.json 配置了启动调试时相关设置，configurations下节点名称可为 app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/
+  // launchtype项可配置值为local或remote, local代表前端连本地云函数，remote代表前端连云端云函数
+    "version": "0.0",
+    "configurations": [{
+     	"app-plus" : 
+     	{
+     		"launchtype" : "local"
+     	},
+     	"default" : 
+     	{
+     		"launchtype" : "local"
+     	},
+     	"type" : "uniCloud"
+     }
+    ]
+}

App.vue

@@ -0,0 +1,34 @@
+<script>
+  import config from './config'
+  import store from '@/store'
+  import { getAccessToken } from '@/utils/auth'
+
+  export default {
+    onLaunch: function() {
+      this.initApp()
+    },
+    methods: {
+      // 初始化应用
+      initApp() {
+        // 初始化应用配置
+        this.initConfig()
+        // 检查用户登录状态
+        //#ifdef H5
+        this.checkLogin()
+        //#endif
+      },
+      initConfig() {
+        this.globalData.config = config
+      },
+      checkLogin() {
+        if (!getAccessToken()) {
+          this.$tab.reLaunch('/pages/login')
+        }
+      }
+    }
+  }
+</script>
+
+<style lang="scss">
+  @import '@/static/scss/index.scss'
+</style>

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2022 芋道
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

api/login.js

@@ -0,0 +1,34 @@
+import request from '@/utils/request'
+
+// 登录方法
+export function login(username, password, captchaVerification) {
+	const data = {
+		username,
+		password,
+		captchaVerification
+	}
+	return request({
+		url: '/system/auth/login',
+		headers: {
+			isToken: false
+		},
+		'method': 'POST',
+		'data': data
+	})
+}
+
+// 获取用户详细信息
+export function getInfo() {
+	return request({
+		url: '/system/auth/get-permission-info',
+		'method': 'GET'
+	})
+}
+
+// 退出方法
+export function logout() {
+	return request({
+		url: '/system/auth/logout',
+		'method': 'POST'
+	})
+}

api/system/user.js

@@ -0,0 +1,42 @@
+import upload from '@/utils/upload'
+import request from '@/utils/request'
+
+// 用户密码重置
+export function updateUserPwd(oldPassword, newPassword) {
+  const data = {
+    oldPassword,
+    newPassword
+  }
+  return request({
+    url: '/system/user/profile/update-password',
+    method: 'PUT',
+    params: data
+  })
+}
+
+// 查询用户个人信息
+export function getUserProfile() {
+  return request({
+    url: '/system/user/profile/get',
+    method: 'GET'
+  })
+}
+
+// 修改用户个人信息
+export function updateUserProfile(data) {
+  return request({
+    url: '/system/user/profile/update',
+    method: 'PUT',
+    data: data
+  })
+}
+
+// 用户头像上传
+export function uploadAvatar(data) {
+  return upload({
+    url: '/system/user/profile/update-avatar',
+    method: 'PUT',
+    name: data.name,
+    filePath: data.filePath
+  })
+}

components/uni-section/uni-section.vue

@@ -0,0 +1,167 @@
+<template>
+	<view class="uni-section">
+		<view class="uni-section-header" @click="onClick">
+				<view class="uni-section-header__decoration" v-if="type" :class="type" />
+        <slot v-else name="decoration"></slot>
+
+        <view class="uni-section-header__content">
+          <text :style="{'font-size':titleFontSize,'color':titleColor}" class="uni-section__content-title" :class="{'distraction':!subTitle}">{{ title }}</text>
+          <text v-if="subTitle" :style="{'font-size':subTitleFontSize,'color':subTitleColor}" class="uni-section-header__content-sub">{{ subTitle }}</text>
+        </view>
+
+        <view class="uni-section-header__slot-right">
+          <slot name="right"></slot>
+        </view>
+		</view>
+
+		<view class="uni-section-content" :style="{padding: _padding}">
+			<slot />
+		</view>
+	</view>
+</template>
+
+<script>
+
+	/**
+	 * Section 标题栏
+	 * @description 标题栏
+	 * @property {String} type = [line|circle|square] 标题装饰类型
+	 * 	@value line 竖线
+	 * 	@value circle 圆形
+	 * 	@value square 正方形
+	 * @property {String} title 主标题
+	 * @property {String} titleFontSize 主标题字体大小
+	 * @property {String} titleColor 主标题字体颜色
+	 * @property {String} subTitle 副标题
+	 * @property {String} subTitleFontSize 副标题字体大小
+	 * @property {String} subTitleColor 副标题字体颜色
+	 * @property {String} padding 默认插槽 padding
+	 */
+
+	export default {
+		name: 'UniSection',
+    emits:['click'],
+		props: {
+			type: {
+				type: String,
+				default: ''
+			},
+			title: {
+				type: String,
+				required: true,
+				default: ''
+			},
+      titleFontSize: {
+        type: String,
+        default: '14px'
+      },
+			titleColor:{
+				type: String,
+				default: '#333'
+			},
+			subTitle: {
+				type: String,
+				default: ''
+			},
+      subTitleFontSize: {
+        type: String,
+        default: '12px'
+      },
+      subTitleColor: {
+        type: String,
+        default: '#999'
+      },
+			padding: {
+				type: [Boolean, String],
+				default: false
+			}
+		},
+    computed:{
+      _padding(){
+        if(typeof this.padding === 'string'){
+          return this.padding
+        }
+
+        return this.padding?'10px':''
+      }
+    },
+		watch: {
+			title(newVal) {
+				if (uni.report && newVal !== '') {
+					uni.report('title', newVal)
+				}
+			}
+		},
+    methods: {
+			onClick() {
+				this.$emit('click')
+			}
+		}
+	}
+</script>
+<style lang="scss" >
+	$uni-primary: #2979ff !default;
+
+	.uni-section {
+		background-color: #fff;
+    .uni-section-header {
+      position: relative;
+      /* #ifndef APP-NVUE */
+      display: flex;
+      /* #endif */
+      flex-direction: row;
+      align-items: center;
+      padding: 12px 10px;
+      font-weight: normal;
+
+      &__decoration{
+        margin-right: 6px;
+        background-color: $uni-primary;
+        &.line {
+          width: 4px;
+          height: 12px;
+          border-radius: 10px;
+        }
+
+        &.circle {
+          width: 8px;
+          height: 8px;
+          border-top-right-radius: 50px;
+          border-top-left-radius: 50px;
+          border-bottom-left-radius: 50px;
+          border-bottom-right-radius: 50px;
+        }
+
+        &.square {
+          width: 8px;
+          height: 8px;
+        }
+      }
+
+      &__content {
+        /* #ifndef APP-NVUE */
+        display: flex;
+        /* #endif */
+        flex-direction: column;
+        flex: 1;
+        color: #333;
+
+        .distraction {
+          flex-direction: row;
+          align-items: center;
+        }
+        &-sub {
+          margin-top: 2px;
+        }
+      }
+
+      &__slot-right{
+        font-size: 14px;
+      }
+    }
+
+    .uni-section-content{
+      font-size: 14px;
+    }
+	}
+</style>

components/verifition/utils/ase.js

@@ -0,0 +1,14 @@
+import CryptoJS from 'crypto-js'
+/**
+ * @word 要加密的内容
+ * @keyWord String  服务器随机返回的关键字
+ *  */
+export function aesEncrypt(word, keyWord = "XwKsGlMcdPMEhR1B") {
+	var key = CryptoJS.enc.Utf8.parse(keyWord);
+	var srcs = CryptoJS.enc.Utf8.parse(word);
+	var encrypted = CryptoJS.AES.encrypt(srcs, key, {
+		mode: CryptoJS.mode.ECB,
+		padding: CryptoJS.pad.Pkcs7
+	});
+	return encrypted.toString();
+}

components/verifition/utils/request.js

@@ -0,0 +1,17 @@
+import config from '@/config'
+const baseUrl = config.baseUrl
+export const myRequest = (option = {}) => {
+	return new Promise((reslove, reject) => {
+		uni.request({
+			url: baseUrl + option.url,
+			data: option.data,
+			method: option.method || "GET",
+			success: (result) => {
+				reslove(result)
+			},
+			fail: (error) => {
+				reject(error)
+			}
+		})
+	})
+}

config.js

@@ -0,0 +1,27 @@
+// 应用全局配置
+module.exports = {
+  // baseUrl: 'http://api-dashboard.yudao.iocoder.cn',
+  baseUrl: 'http://192.168.2.7:48080',
+  baseApi: '/admin-api',
+  // 应用信息
+  appInfo: {
+    // 应用名称
+    name: "yudao-app",
+    // 应用版本
+    version: "1.0.0",
+    // 应用logo
+    logo: "/static/logo.png",
+    // 官方网站
+    site_url: "https://iocoder.cn",
+    // 政策协议
+    agreements: [{
+        title: "隐私政策",
+        url: "https://iocoder.cn"
+      },
+      {
+        title: "用户服务协议",
+        url: "https://iocoder.cn"
+      }
+    ]
+  }
+}

main.js

@@ -0,0 +1,17 @@
+import Vue from 'vue'
+import App from './App'
+import store from './store' // store
+import plugins from './plugins' // plugins
+import './permission' // permission
+Vue.use(plugins)
+
+Vue.config.productionTip = false
+Vue.prototype.$store = store
+
+App.mpType = 'app'
+
+const app = new Vue({
+  ...App
+})
+
+app.$mount()

manifest.json

@@ -0,0 +1,73 @@
+{
+    "name" : "芋道移动端",
+    "appid" : "__UNI__B5DFCD0",
+    "description" : "",
+    "versionName" : "1.0.0",
+    "versionCode" : "100",
+    "transformPx" : false,
+    "app-plus" : {
+        "usingComponents" : true,
+        "nvueCompiler" : "uni-app",
+        "splashscreen" : {
+            "alwaysShowBeforeRender" : true,
+            "waiting" : true,
+            "autoclose" : true,
+            "delay" : 0
+        },
+        "modules" : {},
+        "distribute" : {
+            "android" : {
+                "permissions" : [
+                    "<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
+                    "<uses-permission android:name=\"android.permission.VIBRATE\"/>",
+                    "<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
+                    "<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
+                    "<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
+                    "<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.CAMERA\"/>",
+                    "<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
+                    "<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
+                    "<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
+                    "<uses-feature android:name=\"android.hardware.camera\"/>",
+                    "<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
+                ]
+            },
+            "ios" : {
+                "dSYMs" : false
+            },
+            "sdkConfigs" : {
+                "ad" : {}
+            }
+        }
+    },
+    "quickapp" : {},
+    "mp-weixin" : {
+        "appid" : "wxccd7e2a0911b3397",
+        "setting" : {
+            "urlCheck" : false,
+            "es6" : false,
+            "minified" : true,
+            "postcss" : true
+        },
+        "optimization" : {
+            "subPackages" : true
+        },
+        "usingComponents" : true
+    },
+    "vueVersion" : "2",
+    "h5" : {
+        "template" : "static/index.html",
+        "devServer" : {
+            "port" : 9090,
+            "https" : false
+        },
+        "title" : "Yudao-App",
+        "router" : {
+            "mode" : "hash",
+            "base" : "./"
+        }
+    }
+}

package-lock.json

@@ -0,0 +1,24 @@
+{
+  "name": "yudao-ui-admin-uniapp",
+  "lockfileVersion": 2,
+  "requires": true,
+  "packages": {
+    "": {
+      "dependencies": {
+        "crypto-js": "^4.2.0"
+      }
+    },
+    "node_modules/crypto-js": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/crypto-js/-/crypto-js-4.2.0.tgz",
+      "integrity": "sha512-KALDyEYgpY+Rlob/iriUtjV6d5Eq+Y191A5g4UqLAi8CyGP9N1+FdVbkc1SxKc2r4YAYqG8JzO2KGL+AizD70Q=="
+    }
+  },
+  "dependencies": {
+    "crypto-js": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/crypto-js/-/crypto-js-4.2.0.tgz",
+      "integrity": "sha512-KALDyEYgpY+Rlob/iriUtjV6d5Eq+Y191A5g4UqLAi8CyGP9N1+FdVbkc1SxKc2r4YAYqG8JzO2KGL+AizD70Q=="
+    }
+  }
+}

package.json

@@ -0,0 +1,5 @@
+{
+  "dependencies": {
+    "crypto-js": "^4.2.0"
+  }
+}

pages.json

@@ -0,0 +1,76 @@
+{
+	"pages": [{
+		"path": "pages/login/login",
+		"style": {
+			"navigationBarTitleText": "登录",
+			"navigationStyle": "custom"
+		}
+	}, {
+		"path": "pages/home/index",
+		"style": {
+			"navigationBarTitleText": "首页",
+			"navigationStyle": "custom"
+		}
+	}, {
+		"path": "pages/power/index",
+		"style": {
+			"navigationBarTitleText": "电量预测",
+			"navigationStyle": "custom"
+		}
+	}, {
+		"path": "pages/type/index",
+		"style": {
+			"navigationBarTitleText": "故障分类",
+			"navigationStyle": "custom"
+		}
+	}, {
+		"path": "pages/report/index",
+		"style": {
+			"navigationBarTitleText": "数据简报",
+			"navigationStyle": "custom"
+		}
+	}, {
+		"path": "pages/warn/index",
+		"style": {
+			"navigationBarTitleText": "故障预警",
+			"navigationStyle": "custom"
+		}
+	}],
+	"tabBar": {
+		"color": "#6A98CB",
+		"selectedColor": "#FF8902",
+		"borderStyle": "white",
+		"backgroundColor": "#000",
+		"list": [{
+			"pagePath": "pages/home/index",
+			"iconPath": "static/jnImage/indexPage/home.png",
+			"selectedIconPath": "static/jnImage/indexPage/homeS.png",
+			"text": "首页"
+		}, {
+			"pagePath": "pages/power/index",
+			"iconPath": "static/jnImage/indexPage/power.png",
+			"selectedIconPath": "static/jnImage/indexPage/powerS.png",
+			"text": "电量预测"
+		}, {
+			"pagePath": "pages/type/index",
+			"iconPath": "static/jnImage/indexPage/type.png",
+			"selectedIconPath": "static/jnImage/indexPage/typeS.png",
+			"text": "故障分类"
+		}, {
+			"pagePath": "pages/report/index",
+			"iconPath": "static/jnImage/indexPage/report.png",
+			"selectedIconPath": "static/jnImage/indexPage/reportS.png",
+			"text": "数据简报"
+		}, {
+			"pagePath": "pages/warn/index",
+			"iconPath": "static/jnImage/indexPage/warn.png",
+			"selectedIconPath": "static/jnImage/indexPage/warnS.png",
+			"text": "故障预警"
+		}]
+	},
+	"globalStyle": {
+		"navigationBarTextStyle": "black",
+		"navigationBarTitleText": "RuoYi",
+		"navigationBarBackgroundColor": "#FFFFFF"
+	}
+}

pages/home/index.vue

@@ -0,0 +1,594 @@
+<template>
+	<view class="home">
+		<view class="home_header">
+			<view class="header_message">
+				<image src="../../static/jnImage/indexPage/message.png"></image>
+			</view>
+			<view class="header_title">
+				<image src="../../static/jnImage/loginPage/logo.png" mode=""></image>
+				<text class="titleName">晋能新能源蒙东分公司</text>
+			</view>
+			<view class="header_more">
+				<image src="../../static/jnImage/indexPage/more.png"></image>
+			</view>
+		</view>
+		<view class="home_main">
+			<view class="main_time">
+				<view class="mesTime">
+					<image src="../../static/jnImage/indexPage/time.png"></image>
+					<text>2023年11月20日</text>
+					<text>星期一</text>
+					<text>09:19</text>
+				</view>
+				<view class="mesAll">
+					<view class="mesEx" v-for="(item,index) in mesExData" :key="index">
+						<view class="mesEx_left">
+							<text class="mesEx_left_top">
+								<text class="nameSty">{{item.leftName}}</text>
+							</text>
+							<view class=" mesEx_left_end">
+								<text>{{item.leftValue}}</text>
+								<text>{{item.leftCode}}</text>
+							</view>
+						</view>
+						<view class="mesEx_left">
+							<text class="mesEx_left_top">
+								<text class="nameSty">{{item.rightName}}</text>
+							</text>
+							<view class="mesEx_left_end">
+								<text>{{item.rightValue}}</text>
+								<text>{{item.rightCode}}</text>
+							</view>
+						</view>
+					</view>
+					<view class="windMsg">
+						<view class="flex justify-center" style="margin-bottom: 6px;">
+							<view class="windMsg_title">
+								<image src="../../static/jnImage/indexPage/wancheng.png" mode=""></image>
+								<text>风机状态</text>
+							</view>
+						</view>
+						<view class="windMsg_main">
+							<view class="windMsg_main_msg flex justify-between">
+								<view class="windMsgSty flex">
+									<view class="windMsgSty_left">
+										<image src="../../static/jnImage/indexPage/jieru.png" mode=""></image>
+										<text>接入</text>
+									</view>
+									<view class="windMsgSty_right flex justify-between">
+										<text>600</text>
+										<text>台</text>
+									</view>
+								</view>
+								<view class="windMsgSty flex">
+									<view class="windMsgSty_left">
+										<image src="../../static/jnImage/indexPage/daiji.png" mode=""></image>
+										<text>待机</text>
+									</view>
+									<view class="windMsgSty_right flex justify-between">
+										<text>600</text>
+										<text>台</text>
+									</view>
+								</view>
+							</view>
+							<view class="windMsg_main_msg flex justify-between">
+								<view class="windMsgSty flex">
+									<view class="windMsgSty_left">
+										<image src="../../static/jnImage/indexPage/yunxing.png" mode=""></image>
+										<text>运行</text>
+									</view>
+									<view class="windMsgSty_right flex justify-between">
+										<text>600</text>
+										<text>台</text>
+									</view>
+								</view>
+								<view class="windMsgSty flex">
+									<view class="windMsgSty_left">
+										<image src="../../static/jnImage/indexPage/guzhang.png" mode=""></image>
+										<text>故障</text>
+									</view>
+									<view class="windMsgSty_right flex justify-between">
+										<text>600</text>
+										<text>台</text>
+									</view>
+								</view>
+							</view>
+							<view class="windMsg_main_msg flex justify-between">
+								<view class="windMsgSty flex">
+									<view class="windMsgSty_left">
+										<image src="../../static/jnImage/indexPage/weihu.png" mode=""></image>
+										<text>维护</text>
+									</view>
+									<view class="windMsgSty_right flex justify-between">
+										<text>600</text>
+										<text>台</text>
+									</view>
+								</view>
+								<view class="windMsgSty flex">
+									<view class="windMsgSty_left">
+										<image src="../../static/jnImage/indexPage/lixian.png" mode=""></image>
+										<text>离线</text>
+									</view>
+									<view class="windMsgSty_right flex justify-between">
+										<text>600</text>
+										<text>台</text>
+									</view>
+								</view>
+							</view>
+						</view>
+					</view>
+					<view class="powerMsg">
+						<view class="flex justify-center" style="margin-bottom: 6px;">
+							<view class="windMsg_title">
+								<image src="../../static/jnImage/indexPage/wancheng.png" mode=""></image>
+								<text>光伏状态</text>
+							</view>
+						</view>
+						<view class="windMsg_main">
+							<view class="windMsg_main_msg flex justify-between">
+								<view class="windMsgSty flex">
+									<view class="windMsgSty_left">
+										<image src="../../static/jnImage/indexPage/jieruP.png" mode=""></image>
+										<text>接入</text>
+									</view>
+									<view class="windMsgSty_right flex justify-between">
+										<text>600</text>
+										<text>台</text>
+									</view>
+								</view>
+								<view class="windMsgSty flex">
+									<view class="windMsgSty_left">
+										<image src="../../static/jnImage/indexPage/daijiP.png" mode=""></image>
+										<text>待机</text>
+									</view>
+									<view class="windMsgSty_right flex justify-between">
+										<text>600</text>
+										<text>台</text>
+									</view>
+								</view>
+							</view>
+							<view class="windMsg_main_msg flex justify-between">
+								<view class="windMsgSty flex">
+									<view class="windMsgSty_left">
+										<image src="../../static/jnImage/indexPage/yunxingP.png" mode=""></image>
+										<text>运行</text>
+									</view>
+									<view class="windMsgSty_right flex justify-between">
+										<text>600</text>
+										<text>台</text>
+									</view>
+								</view>
+								<view class="windMsgSty flex">
+									<view class="windMsgSty_left">
+										<image src="../../static/jnImage/indexPage/guzhang.png" mode=""></image>
+										<text>故障</text>
+									</view>
+									<view class="windMsgSty_right flex justify-between">
+										<text>600</text>
+										<text>台</text>
+									</view>
+								</view>
+							</view>
+							<view class="windMsg_main_msg flex justify-between">
+								<view class="windMsgSty flex">
+									<view class="windMsgSty_left">
+										<image src="../../static/jnImage/indexPage/weihu.png" mode=""></image>
+										<text>维护</text>
+									</view>
+									<view class="windMsgSty_right flex justify-between">
+										<text>600</text>
+										<text>台</text>
+									</view>
+								</view>
+								<view class="windMsgSty flex">
+									<view class="windMsgSty_left">
+										<image src="../../static/jnImage/indexPage/lixian.png" mode=""></image>
+										<text>离线</text>
+									</view>
+									<view class="windMsgSty_right flex justify-between">
+										<text>600</text>
+										<text>台</text>
+									</view>
+								</view>
+							</view>
+						</view>
+					</view>
+					<view class="ssjk">
+						<view class="ssjk_title flex justify-center">
+							<image src="../../static/jnImage/indexPage/timeNow.png" mode=""></image>
+							<text>实时监控</text>
+						</view>
+						<view class="ssjk_main">
+							<view class="ssjk_main_msg">
+								<view class="ssjk_main_msg_tit flex">
+									<image src="../../static/jnImage/indexPage/windIcon.png" mode=""></image>
+									<text>宝龙山</text>
+								</view>
+								<view class="ssjk_main_msg_data flex">
+									<view class="msg_data_sty flex">
+										<view class="msg_data_name">
+											<text>风速</text>
+										</view>
+										<view class="dataSty flex">
+											<text>0.00</text>
+											<text>m/s</text>
+										</view>
+									</view>
+									<view class="msg_data_sty flex">
+										<view class="msg_data_name">
+											<text>有功功率</text>
+										</view>
+										<view class="dataSty flex">
+											<text>0.00</text>
+											<text>MW</text>
+										</view>
+									</view>
+									<view class="msg_data_sty flex">
+										<view class="msg_data_name">
+											<text>AGC指令</text>
+										</view>
+										<view class="dataSty flex">
+											<text>0.00</text>
+											<text>MW</text>
+										</view>
+									</view>
+								</view>
+							</view>
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+</template>
+<script>
+	export default {
+		onLoad: function() {},
+		data() {
+			return {
+				mesExData: []
+			}
+		},
+		created() {
+			this.mesExData = [{
+					leftName: '容量',
+					leftValue: 282.3,
+					leftCode: '(WM)',
+					rightName: '安全天数',
+					rightValue: 20,
+					rightCode: '(天)',
+				},
+				{
+					leftName: '风速',
+					leftValue: 282.3,
+					leftCode: '(m/s)',
+					rightName: '功率',
+					rightValue: 20,
+					rightCode: '(MW)',
+				},
+				{
+					leftName: '日发电量',
+					leftValue: 282.3,
+					leftCode: '(万kWh)',
+					rightName: '理论功率',
+					rightValue: 20,
+					rightCode: '(MW)',
+				},
+				{
+					leftName: '年发电量',
+					leftValue: 282.3,
+					leftCode: '(万kWh)',
+					rightName: '月发电量',
+					rightValue: 20,
+					rightCode: '(万kWh)',
+				},
+			]
+		},
+		methods: {
+
+		}
+	}
+</script>
+
+<style lang="scss">
+	page {
+		background-color: #202246;
+	}
+
+	.home {
+		width: 100vw;
+
+		.home_header {
+			width: calc(100% -32px);
+			display: flex;
+			justify-content: space-between;
+			height: 60px;
+			padding-top: 16px;
+			// position: fixed;
+
+			.header_message {
+				width: 15%;
+
+				image {
+					position: relative;
+					top: 0px;
+					left: 10px;
+					width: 30px;
+					height: 30px;
+				}
+			}
+
+			.header_title {
+				width: 70%;
+				position: relative;
+				left: 10px;
+
+				image {
+					width: 28px;
+					height: 22px;
+					position: relative;
+					top: 5px;
+				}
+
+				.titleName {
+					line-height: 20px;
+					margin-left: 5px;
+					font-size: 36upx;
+					font-family: FZZhengHeiS-M-GB;
+					font-weight: 600;
+					letter-spacing: 2px;
+					color: #fff;
+				}
+			}
+
+			.header_more {
+				width: 15%;
+				position: relative;
+				top: 5px;
+				left: 10px;
+
+				image {
+					width: 30px;
+					height: 20px;
+				}
+			}
+		}
+
+		.home_main {
+			padding: 0 20px;
+
+			.main_time {
+				margin-top: 10px;
+
+				.mesTime {
+					display: flex;
+					padding: 3px 0;
+					border-bottom: 1px solid rgba(255, 255, 255, 0.25);
+
+					image {
+						width: 20px;
+						height: 20px;
+					}
+
+					text {
+						font-size: 34upx;
+						color: #fff;
+						margin-left: 15px;
+					}
+
+					text:nth-of-type(3) {
+						position: relative;
+						top: 3px;
+					}
+
+				}
+
+				.mesAll {
+					.mesEx {
+						display: flex;
+						padding: 3px 0;
+						border-bottom: 1px solid rgba(255, 255, 255, 0.25);
+						line-height: 30px;
+						color: #fff;
+
+						.mesEx_left {
+							display: flex;
+							width: 50%;
+
+							.mesEx_left_top {
+								width: 40%;
+								font-size: 28upx;
+
+								.nameSty {
+									width: 100%;
+									display: inline-block;
+									position: relative;
+									text-align-last: justify;
+									text-align: justify;
+
+								}
+							}
+
+							.mesEx_left_end {
+								width: 56%;
+								margin: 0 10px;
+								display: flex;
+								justify-content: space-between;
+
+								text:nth-of-type(1) {
+									font-size: 34upx;
+								}
+
+								text:nth-of-type(2) {
+									font-size: 20upx;
+									color: #92949B;
+								}
+							}
+
+						}
+
+
+					}
+
+					.windMsg,
+					.powerMsg {
+						margin-top: 15px;
+
+						.windMsg_title {
+							width: 40%;
+							height: 30px;
+							display: flex;
+							justify-content: center;
+							align-items: center;
+							padding: 6px 13px;
+							background: rgba(51, 57, 118, 0.7);
+							border-radius: 5px;
+
+							image {
+								width: 18px;
+								height: 18px;
+							}
+
+							text {
+								margin-left: 5px;
+								font-size: 34upx;
+								color: #fff;
+
+							}
+						}
+
+						.windMsg_main {
+							.windMsg_main_msg {
+								margin-bottom: 8px;
+
+								.windMsgSty {
+									padding: 5px 8px;
+									width: 49%;
+									background: #3F4572;
+									border-radius: 5px;
+
+									.windMsgSty_left {
+										width: 49%;
+										height: 32px;
+
+										image {
+											width: 32px;
+											height: 32px;
+										}
+
+										text {
+											width: 100px;
+											display: inline-block;
+											color: #9A9BA6;
+											font-size: 28upx;
+											margin-left: 10px;
+											position: relative;
+											top: -26px;
+											left: 28px;
+										}
+									}
+
+									.windMsgSty_right {
+										width: 49%;
+										position: relative;
+										top: 9px;
+
+										text:nth-of-type(1) {
+											margin-left: 5px;
+											width: 50%;
+											font-size: 34upx;
+											color: #fff;
+										}
+
+										text:nth-of-type(2) {
+											font-size: 28upx;
+											color: #9A9BA6;
+										}
+									}
+								}
+							}
+						}
+					}
+
+					.ssjk {
+						margin-top: 15px;
+						margin-bottom: 30px;
+
+						.ssjk_title {
+							width: 120px;
+							height: 45px;
+							// background: #333976;
+							background: linear-gradient(90deg, #333976, #202246);
+							align-items: center;
+
+							image {
+								width: 22px;
+								height: 22px;
+							}
+
+							text {
+								margin-left: 10px;
+								font-size: 16px;
+								color: #fff;
+							}
+						}
+
+						.ssjk_main {
+							.ssjk_main_msg {
+								margin-top: 15px;
+
+								.ssjk_main_msg_tit {
+									image {
+										width: 18px;
+										height: 18px;
+									}
+
+									text {
+										margin-left: 10px;
+										font-size: 14px;
+										color: #A49EAC;
+										position: relative;
+										top: -2px;
+									}
+								}
+
+								.ssjk_main_msg_data {
+									width: 100%;
+									color: #fff;
+									font-size: 10px;
+
+									.msg_data_sty {
+										width: 33%;
+										margin-right: 2px;
+										background: #2E336D;
+
+										.msg_data_name {
+											width: 50%;
+											padding: 3px 0;
+											display: inline-block;
+											background: #3F4572;
+											text-align: center;
+										}
+
+										.dataSty {
+											width: 50%;
+											background: #2E336D;
+											padding: 0 3px;
+											justify-content: space-between;
+
+											text {
+												position: relative;
+												top: 5px;
+											}
+										}
+									}
+								}
+							}
+						}
+					}
+				}
+			}
+		}
+	}
+</style>

pages/login/login.vue

@@ -0,0 +1,187 @@
+<template>
+	<view class="normal-login-container">
+		<view class="logo-content">
+			<image src="../../static/jnImage/loginPage/logo.png">
+			</image>
+			<view class="logoTit">
+				<view class="titleZN">晋能新能源蒙东分公司</view>
+				<view class="titleEN">HUANENG RENEWALES MENGDONG BRANCH</view>
+			</view>
+		</view>
+		<view class="login-form-content">
+			<view class="input-item flex align-center">
+				<image src="../../static/jnImage/loginPage/userName.png">
+					<input v-model="loginForm.username" class="input" type="text" placeholder="用户名" maxlength="30" />
+			</view>
+			<view class="input-item flex align-center">
+				<image src="../../static/jnImage/loginPage/locked.png">
+					<input v-model="loginForm.password" type="password" class="input" placeholder="密码" maxlength="20" />
+			</view>
+			<view class="action-btn">
+				<button @click="handleLogin" class="login-btn">登录</button>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'Login',
+		data() {
+			return {
+				captchaEnabled: false, // 验证码开关 TODO 芋艿：需要抽到配置里
+				globalConfig: getApp().globalData.config,
+				loginForm: {
+					username: "admin",
+					password: "admin123"
+				}
+			}
+		},
+		methods: {
+			// 登录方法
+			handleLogin(params) {
+				// if (this.loginForm.username === "") {
+				// 	this.$modal.msgError("请输入您的账号")
+				// } else if (this.loginForm.password === "") {
+				// 	this.$modal.msgError("请输入您的密码")
+				// } else {
+				// 	// await this.pwdLogin({})
+				// uni.navigateTo({
+				// 	url: '/pages/power/index'
+				// });
+				// }
+				let that = this
+
+				that.$tab.switchTab('/pages/home/index')
+			},
+			// 密码登录
+			async pwdLogin() {
+				// this.$modal.loading("登录中，请耐心等待...")
+				// 执行登录
+				// this.$store.dispatch('Login', this.loginForm).then(() => {
+				// 	this.$modal.closeLoading()
+				// 	this.loginSuccess()
+				// })
+				this.loginSuccess()
+			},
+			// 登录成功后，处理函数
+			loginSuccess(result) {
+				// 设置用户信息
+				// this.$store.dispatch('GetInfo').then(res => {
+				// 	this.$tab.reLaunch('/pages/index')
+				// })
+				// this.$tab.reLaunch('/pages/index')
+				uni.navigateTo({
+					url: '/pages/index',
+					success: res => {},
+					fail: () => {},
+					complete: () => {}
+				});
+				// this.$tab.navigateTo('/pages/index')
+
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	page {
+		background-color: #202246;
+	}
+
+	.normal-login-container {
+		// background: url('../static/jnImage/loginPage/loginBack.png');
+		// background-replate:
+		width: 100%;
+		hieght: 100vh;
+
+		.logo-content {
+			width: 100%;
+			font-size: 21px;
+			text-align: center;
+			padding-top: 15%;
+
+			image {
+				border-radius: 4px;
+				margin-top: 40px;
+				width: 80px;
+				height: 60px;
+			}
+
+			.logoTit {
+				color: #fff;
+
+				.titleZN {
+					margin-top: 15px;
+					font-size: 44upx;
+					font-family: FZZhengHeiS-M-GB;
+					font-weight: 500;
+					color: #FFFFFF;
+					letter-spacing: 3px;
+				}
+
+				.titleEN {
+					margin-top: 5px;
+					font-size: 24upx;
+					color: #E5E9F2;
+				}
+			}
+		}
+
+		.login-form-content {
+			text-align: center;
+			margin: 20px auto;
+			margin-top: 60%;
+			width: 80%;
+
+			.input-item {
+				margin: 20px auto;
+				// background-color: #f5f6f7;
+				height: 45px;
+
+				border-bottom: 1px solid #f5f6f7;
+
+				image {
+					width: 20px;
+					height: 23px;
+				}
+
+				.input {
+					color: #fff;
+					width: 100%;
+					font-size: 14px;
+					line-height: 20px;
+					text-align: left;
+					padding-left: 15px;
+
+					.uni-input-wrapper {
+						.input-placeholder {
+							color: #fff;
+							font-size: 16px;
+						}
+					}
+				}
+
+
+			}
+
+			.login-btn {
+				margin-top: 30px;
+				height: 40px;
+				color: #fff;
+				background: #4287FF;
+				border-radius: 10px;
+				letter-spacing: 10px;
+				line-height: 40px;
+			}
+		}
+
+		.easyinput {
+			width: 100%;
+		}
+	}
+
+	.login-code-img {
+		height: 45px;
+	}
+</style>

pages/power/index.vue

@@ -0,0 +1,703 @@
+<template>
+	<view class="power">
+		<view class="home_header">
+			<view class="header_message">
+				<image src="../../static/jnImage/indexPage/message.png"></image>
+			</view>
+			<view class="header_title">
+				<image src="../../static/jnImage/loginPage/logo.png" mode=""></image>
+				<text class="titleName">晋能新能源蒙东分公司</text>
+			</view>
+			<view class="header_more">
+				<image src="../../static/jnImage/indexPage/more.png"></image>
+			</view>
+		</view>
+		<view class="power_main">
+			<view class="flex justify-center">
+				<view class="power_tab">
+					<text v-for="(item,index) in powerTabData" :key="index" @click="changePowerTab(item)"
+						:style="item.showColor ? 'background: #4287FF;color:#fff': ''">{{item.nameZN}}</text>
+				</view>
+			</view>
+			<view class="fdwcl" v-if="powerTab === 'DL'">
+				<view class="flex justify-between">
+					<view class="fdwcl_title flex justify-center">
+						<image src="../../static/jnImage/powerPage/powerTu.png" mode=""></image>
+						<text>发电完成率</text>
+					</view>
+					<view class="yearTab">
+						<text v-for="(item,index) in yearData" :key="index" @click="changeYearTab(item)"
+							:style="item.showColor ? 'background: #4287FF;color:#fff': ''">{{item.nameZN}}</text>
+					</view>
+				</view>
+				<view class="fdwcl_DataAll" v-for="(item,index) in powerProgressData" :key="index">
+					<view class="fdwcl_Data flex justify-between">
+						<view class="fdwcl_Data_1 flex">
+							<image src="../../static/jnImage/indexPage/windIcon.png" mode=""></image>
+							<text>{{item.inPower}}万kWh</text>
+						</view>
+						<view class="fdwcl_Data_2">
+							<text>{{item.name}}</text>
+						</view>
+						<view class="fdwcl_Data_3">
+							<text>{{item.allPower}}万kWh</text>
+						</view>
+					</view>
+					<view class="fdwcl_Data_msg">
+						<view class="show_msg" :style="showProgress(item, index)">
+
+						</view>
+					</view>
+				</view>
+			</view>
+			<view class="ycdl" v-else>
+				<view class="ycdl_msg" v-for="(item,index) in 3" :key="index">
+					<view class="ycdl_title flex">
+						<image src="../../static/jnImage/powerPage/clock.png" mode=""></image>
+						<text>11月22日</text>
+						<text>预测电量</text>
+					</view>
+					<view class="ycdl_data">
+						<uni-row class="ycdl_data_row">
+							<uni-col :span="12" v-for="(item,index) in powerProgressData" :key="index">
+								<view class="ycdl_data_col flex">
+									<view class="ycdl_data_col_left">
+										<text>{{item.name}}</text>
+									</view>
+									<view class="ycdl_data_col_right flex justify-between">
+										<text>{{item.inPower}}</text>
+										<text>MW</text>
+									</view>
+								</view>
+							</uni-col>
+						</uni-row>
+					</view>
+				</view>
+			</view>
+			<view class="rdldb" v-if="powerTab === 'DL'">
+				<view class="rdldb_title flex justify-center">
+					<image src="../../static/jnImage/powerPage/powerDayIcon.png" mode=""></image>
+					<text>日电量对比</text>
+				</view>
+				<view class="qiun-charts">
+					<qiun-data-charts type="column" :opts="opts" :chartData="chartData" />
+				</view>
+			</view>
+			<view class="xsfsgl" v-else>
+				<view class="xsfsgl_title flex justify-center">
+					<image src="../../static/jnImage/powerPage/72clock.png" mode=""></image>
+					<text>72小时风速功率</text>
+				</view>
+				<view class="qiun-chartsLine">
+					<qiun-data-charts type="mix" :opts="optsLine" :chartData="chartDataLine" />
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	// import * as echarts from 'echarts'
+	// import uCharts from '../../components/u-charts/u-charts.js';
+	// import qCharts from '../../components/u-charts/component.vue';
+	var uChartsInstance = {};
+	export default {
+		onLoad: function() {},
+		data() {
+			return {
+				powerTab: 'DL',
+				yearTab: 'month',
+				powerTabData: [],
+				yearData: [],
+				powerProgressData: [],
+				chartData: {},
+				chartDataLine: {},
+				opts: {},
+				optsLine: {},
+			}
+		},
+		created() {
+			this.powerTabData = [{
+					nameZN: '电量',
+					nameEN: 'DL',
+					showColor: true
+				},
+				{
+					nameZN: '预测',
+					nameEN: 'YC',
+					showColor: false
+
+				}
+			]
+			this.yearData = [{
+						nameZN: '月',
+						nameEN: 'month',
+						showColor: true
+					},
+					{
+						nameZN: '年',
+						nameEN: 'year',
+						showColor: false
+
+					}
+				],
+				this.powerProgressData = [{
+						type: 'wind',
+						inPower: 961,
+						allPower: 1865,
+						name: '宝龙山'
+					},
+					{
+						type: 'wind',
+						inPower: 852,
+						allPower: 1865,
+						name: '乌力吉'
+					},
+					{
+						type: 'wind',
+						inPower: 696,
+						allPower: 1865,
+						name: '浩日格吐'
+					},
+					{
+						type: 'wind',
+						inPower: 527,
+						allPower: 1865,
+						name: '开鲁'
+					},
+					{
+						type: 'wind',
+						inPower: 935,
+						allPower: 1865,
+						name: '景观'
+					},
+					{
+						type: 'wind',
+						inPower: 1022,
+						allPower: 1865,
+						name: '高力板'
+					},
+					{
+						type: 'wind',
+						inPower: 752,
+						allPower: 1865,
+						name: '书声'
+					},
+					{
+						type: 'wind',
+						inPower: 1520,
+						allPower: 1865,
+						name: '宝力根花'
+					},
+					{
+						type: 'wind',
+						inPower: 365.6,
+						allPower: 1865,
+						name: '振发'
+					},
+				]
+		},
+		onReady() {
+			this.getPowerBar()
+		},
+		methods: {
+			getPowerBar() {
+				let opts = {
+					color: ["#1890FF", "#91CB74", "#FAC858", "#EE6666", "#73C0DE", "#3CA272", "#FC8452", "#9A60B4",
+						"#ea7ccc"
+					],
+					padding: [15, 15, 0, 5],
+					enableScroll: false,
+					legend: {
+						show: false
+					},
+					xAxis: {
+						disableGrid: true,
+						rotateLabel: true,
+						axisLineColor: "#A49EAC",
+						fontColor: "#A49EAC",
+						fontSize: 10,
+						marginTop: 5
+					},
+					yAxis: {
+						showTitle: true,
+						data: [{
+							min: 0,
+							fontColor: "#A49EAC",
+							title: "(万kwh)",
+							titleFontColor: "#A49EAC",
+							titleFontSize: 10
+						}]
+					},
+					extra: {
+						column: {
+							type: "group",
+							width: 15,
+							activeBgColor: "#000000",
+							activeBgOpacity: 0.08
+						}
+					}
+				}
+
+				let proColor = ['#6C4B9E', '#323A97', '#4951B2', '#4287FF', '#3CB8FE', '#1AA7B5', '#5183B6', '#9F65C1',
+					'#766FF1', '#4951B2',
+				]
+				//模拟服务器返回数据，如果数据格式和标准格式不同，需自行按下面的格式拼接
+
+				let xAxis = []
+				let series = []
+				this.powerProgressData.forEach((item, index) => {
+					xAxis.push(item.name)
+					let obj = {
+						color: '',
+						name: '',
+						textSize: 10,
+						textColor: "#A49EAC",
+						value: item.inPower
+					}
+					proColor.forEach((it, idx) => {
+						if (index.toString().length > 1) {
+							obj.color = proColor[index.toString().slice(-1)]
+						} else {
+							obj.color = proColor[index]
+						}
+					})
+					series.push(obj)
+				})
+				let res = {
+					categories: xAxis,
+					series: [{
+						data: series
+					}]
+				};
+				this.opts = opts
+				this.chartData = JSON.parse(JSON.stringify(res));
+			},
+			getLineBar() {
+				let opts = {
+					color: ["#1890FF", "#91CB74", "#FAC858", "#EE6666", "#73C0DE", "#3CA272", "#FC8452", "#9A60B4",
+						"#ea7ccc"
+					],
+					padding: [15, 15, 0, 5],
+					enableScroll: false,
+					legend: {
+						show: true
+					},
+					xAxis: {
+						disableGrid: true,
+						axisLineColor: "#A49EAC",
+						fontColor: "#A49EAC",
+						fontSize: 10,
+						marginTop: 5
+					},
+					yAxis: {
+						showTitle: true,
+						disabled: false,
+						disableGrid: false,
+						splitNumber: 5,
+						gridType: "dash",
+						dashLength: 4,
+						gridColor: "#CCCCCC",
+						padding: 10,
+						data: [{
+								position: "left",
+								title: "折线",
+								fontColor: "#A49EAC",
+								titleFontColor: "#A49EAC",
+								titleFontSize: 10
+							},
+							{
+								position: "right",
+								min: 0,
+								max: 200,
+								title: "点",
+								textAlign: "left",
+								fontColor: "#A49EAC",
+								titleFontColor: "#A49EAC",
+								titleFontSize: 10
+							}
+						]
+					},
+					extra: {
+						mix: {
+							column: {
+								width: 20
+							}
+						}
+					}
+				}
+
+				let proColor = ['#6C4B9E', '#323A97', '#4951B2', '#4287FF', '#3CB8FE', '#1AA7B5', '#5183B6', '#9F65C1',
+					'#766FF1', '#4951B2',
+				]
+				//模拟服务器返回数据，如果数据格式和标准格式不同，需自行按下面的格式拼接
+
+				let res = {
+					categories: ["2018", "2019", "2020", "2021", "2022", "2023"],
+					series: [{
+							name: "折线",
+							type: "line",
+							color: "#2fc25b",
+							data: [150, 186, 205, 155, 96, 84]
+						},
+						{
+							name: "折线",
+							type: "line",
+							color: "#2fc25b",
+							data: [120, 140, 105, 170, 95, 160]
+						},
+						{
+							name: "点",
+							index: 2,
+							type: "point",
+							color: "#f04864",
+							data: [100, 80, 125, 150, 112, 132]
+						}
+					]
+				};
+				this.optsLine = opts
+				this.chartDataLine = JSON.parse(JSON.stringify(res));
+			},
+			changePowerTab(item) {
+				this.powerTabData.forEach(it => {
+					it.showColor = false
+					if (it.nameEN === item.nameEN) {
+						item.showColor = true
+						this.powerTab = it.nameEN
+					}
+				})
+				if (this.powerTab === 'DL') {
+					this.getPowerBar()
+				} else {
+					this.getLineBar()
+				}
+			},
+			changeYearTab(item) {
+				this.yearData.forEach(it => {
+					it.showColor = false
+					if (it.nameEN === item.nameEN) {
+						item.showColor = true
+						this.yearTab = it.nameEN
+					}
+				})
+			},
+			showProgress(item, index) {
+				let indexX = index
+				if (index > 9) {
+					indexX = index - 9
+				}
+				let proColor = ['#6C4B9E', '#323A97', '#4951B2', '#4287FF', '#3CB8FE', '#1AA7B5', '#5183B6', '#9F65C1',
+					'#766FF1'
+				]
+				let pro = ((item.inPower / item.allPower).toFixed(2)) * 100 + '%'
+				let showColor = proColor[indexX]
+				let ss = `width: ${pro};background: ${showColor}`
+				return ss
+			},
+
+		},
+	}
+</script>
+
+<style lang="scss">
+	page {
+		background-color: #202246;
+	}
+
+	.power {
+		width: 100vw;
+
+		.home_header {
+			width: calc(100% -32px);
+			display: flex;
+			justify-content: space-between;
+			height: 60px;
+			padding-top: 16px;
+			// position: fixed;
+
+			.header_message {
+				width: 15%;
+
+				image {
+					position: relative;
+					top: 0px;
+					left: 10px;
+					width: 30px;
+					height: 30px;
+				}
+			}
+
+			.header_title {
+				width: 70%;
+				position: relative;
+				left: 10px;
+
+				image {
+					width: 28px;
+					height: 22px;
+					position: relative;
+					top: 5px;
+				}
+
+				.titleName {
+					line-height: 20px;
+					margin-left: 5px;
+					font-size: 36upx;
+					font-family: FZZhengHeiS-M-GB;
+					font-weight: 600;
+					letter-spacing: 2px;
+					color: #fff;
+				}
+			}
+
+			.header_more {
+				width: 15%;
+				position: relative;
+				top: 5px;
+				left: 10px;
+
+				image {
+					width: 30px;
+					height: 20px;
+				}
+			}
+		}
+
+		.power_main {
+			padding: 0 20px;
+
+			.power_tab {
+				text {
+					display: inline-block;
+					width: 80px;
+					height: 25px;
+					border: 1px solid #4287FF;
+					text-align: center;
+					color: #4287FF;
+					line-height: 25px;
+					letter-spacing: 2px;
+				}
+			}
+
+			.fdwcl {
+				.fdwcl_title {
+					width: 130px;
+					height: 45px;
+					padding-left: 10px;
+					margin-top: 10px;
+					background: linear-gradient(90deg, #333976, #202246);
+					align-items: center;
+
+					image {
+						width: 24px;
+						height: 22px;
+					}
+
+					text {
+						margin-left: 10px;
+						font-size: 16px;
+						color: #fff;
+					}
+				}
+
+				.yearTab {
+					width: 80px;
+					height: 25px;
+					border-radius: 20px;
+					background: #0B143E;
+					margin-top: 20px;
+
+					text {
+						display: inline-block;
+						width: 40px;
+						height: 25px;
+						border-radius: 20px;
+						text-align: center;
+						color: #4287FF;
+						line-height: 25px;
+					}
+				}
+
+				.fdwcl_DataAll {
+					margin-top: 10px;
+
+					.fdwcl_Data {
+						.fdwcl_Data_1 {
+							image {
+								width: 18px;
+								height: 18px;
+							}
+
+							text {
+								margin-left: 5px;
+								font-size: 28upx;
+								color: #A49EAC;
+								position: relative;
+								top: 0px;
+							}
+						}
+
+						.fdwcl_Data_2 {
+							text {
+								font-size: 32upx;
+								color: #A49EAC;
+							}
+						}
+
+						.fdwcl_Data_3 {
+							text {
+								font-size: 28upx;
+								color: #A49EAC;
+							}
+						}
+					}
+
+					.fdwcl_Data_msg {
+						width: 100%;
+						height: 20px;
+						border-radius: 5px;
+						background: #0B143E;
+
+						.show_msg {
+							height: 20px;
+							background: #6C4B9E;
+							border-radius: 5px 0 0 5px;
+						}
+					}
+				}
+			}
+
+			.rdldb {
+				padding-bottom: 20px;
+
+				.rdldb_title {
+					width: 130px;
+					height: 45px;
+					padding-left: 10px;
+					margin-top: 10px;
+					background: linear-gradient(90deg, #333976, #202246);
+					align-items: center;
+
+					image {
+						width: 24px;
+						height: 22px;
+					}
+
+					text {
+						margin-left: 10px;
+						font-size: 16px;
+						color: #fff;
+					}
+				}
+
+				.qiun-charts {
+					width: 100%;
+					height: 300px;
+					margin: 10px 0;
+				}
+			}
+
+			.ycdl {
+				margin-top: 10px;
+
+				.ycdl_msg {
+					.ycdl_title {
+						image {
+							width: 15px;
+							height: 15px;
+							position: relative;
+							top: 3px;
+						}
+
+						text {
+							font-size: 32upx;
+							color: #676D9C;
+							margin-left: 10px;
+						}
+					}
+
+					.ycdl_data {
+						margin-top: 5px;
+
+						.ycdl_data_row {
+							.ycdl_data_col {
+								width: 98%;
+								height: 20px;
+								margin-bottom: 5px;
+								background: #2E336D;
+								border-radius: 5px;
+
+								.ycdl_data_col_left {
+									width: 50%;
+									height: 20px;
+									color: #fff;
+									font-size: 30upx;
+									background: #3F4572;
+									border-radius: 5px;
+
+									text {
+										margin-left: 5px;
+									}
+								}
+
+								.ycdl_data_col_right {
+									height: 20px;
+									color: #fff;
+									font-size: 32upx;
+									width: 48%;
+
+									text:nth-of-type(1) {
+										margin-left: 5px;
+										width: 50%;
+										font-size: 32upx;
+										color: #fff;
+										position: relative;
+										top: 3px;
+									}
+
+									text:nth-of-type(2) {
+										font-size: 22upx;
+										color: #96B5D5;
+										position: relative;
+										top: 4px;
+									}
+								}
+							}
+						}
+					}
+				}
+			}
+
+			.xsfsgl {
+				padding-bottom: 20px;
+
+				.xsfsgl_title {
+					width: 160px;
+					height: 45px;
+					padding-left: 10px;
+					margin-top: 10px;
+					background: linear-gradient(90deg, #333976, #202246);
+					align-items: center;
+
+					image {
+						width: 24px;
+						height: 22px;
+					}
+
+					text {
+						margin-left: 10px;
+						font-size: 16px;
+						color: #fff;
+					}
+				}
+
+				.qiun-chartsLine {
+					width: 100%;
+					height: 300px;
+					margin: 10px 0;
+				}
+			}
+		}
+
+	}
+</style>

pages/report/index.vue

@@ -0,0 +1,23 @@
+<template>
+	<view class="home">
+
+	</view>
+</template>
+
+<script>
+	export default {
+		onLoad: function() {}
+	}
+</script>
+
+<style lang="scss">
+	page {
+		background-color: #202246;
+	}
+
+	.home {
+		width: 100vw;
+
+
+	}
+</style>

pages/type/index.vue

@@ -0,0 +1,629 @@
+<template>
+	<view class="faultType">
+		<view class="home_header">
+			<view class="header_message">
+				<image src="../../static/jnImage/indexPage/message.png"></image>
+			</view>
+			<view class="header_title">
+				<image src="../../static/jnImage/loginPage/logo.png" mode=""></image>
+				<text class="titleName">晋能新能源蒙东分公司</text>
+			</view>
+			<view class="header_more">
+				<image src="../../static/jnImage/indexPage/more.png"></image>
+			</view>
+		</view>
+		<view class="faultType_main">
+			<view class="flex justify-center">
+				<view class="faultType_tab">
+					<text v-for="(item,index) in faultTypeTabData" :key="index" @click="changefaultTypeTab(item)"
+						:style="item.showColor ? 'background: #4287FF;color:#fff': ''">{{item.nameZN}}</text>
+				</view>
+			</view>
+			<view class="gzcs">
+				<view class="flex justify-between">
+					<view class="gzcs_title flex justify-center">
+						<image src="../../static/jnImage/powerPage/powerDayIcon.png" mode=""
+							v-if="faultTypeTab === 'XT'"></image>
+						<image src="../../static/jnImage/powerPage/cishu.png" mode="" v-else></image>
+						<text>故障次数</text>
+					</view>
+					<view class="yearTab">
+						<text v-for="(item,index) in yearData" :key="index" @click="changeYearTab(item)"
+							:style="item.showColor ? 'background: #4287FF;color:#fff': ''">{{item.nameZN}}</text>
+					</view>
+				</view>
+				<view class="qiun-chartsPie">
+					<qiun-data-charts type="ring" :opts="opts" :chartData="chartData" />
+				</view>
+				<view class="gzcs_data">
+					<uni-row class="gzcs_data_row">
+						<uni-col :span="12" v-for="(item,index) in faultTypeData" :key="index">
+							<view class="gzcs_data_col flex">
+								<view class="gzcs_data_col_left" :style="showColor(item)">
+									<text>{{item.name}}</text>
+								</view>
+								<view class=" gzcs_data_col_right flex justify-between">
+									<text>{{item.data}}</text>
+									<text>次</text>
+								</view>
+							</view>
+						</uni-col>
+					</uni-row>
+				</view>
+				<view class="heji flex" v-if="faultTypeTab === 'JX'">
+					<view class="heji_img">
+						<image src="../../static/jnImage/powerPage/heji.png" mode=""></image>
+					</view>
+					<view class="heji_msg flex justify-between">
+						<view class="heji_msg_tit">
+							<text>公司合计</text>
+						</view>
+						<view class="heji_msg_data flex justify-between">
+							<text>600</text>
+							<text>次</text>
+						</view>
+					</view>
+				</view>
+			</view>
+			<view class="ssdl">
+				<view class="flex justify-between">
+					<view class="gzcs_title flex justify-center">
+						<image src="../../static/jnImage/powerPage/powerDayIcon.png" mode=""
+							v-if="faultTypeTab === 'XT'"></image>
+						<image src="../../static/jnImage/powerPage/sunshi.png" mode="" v-else></image>
+						<text>损失电量</text>
+					</view>
+					<view class="yearTab">
+						<text v-for="(item,index) in yearData" :key="index" @click="changeYearTab(item)"
+							:style="item.showColor ? 'background: #4287FF;color:#fff': ''">{{item.nameZN}}</text>
+					</view>
+				</view>
+				<view class="qiun-chartsPie">
+					<qiun-data-charts type="ring" :opts="opts" :chartData="chartData" />
+				</view>
+				<view class="gzcs_data">
+					<uni-row class="gzcs_data_row">
+						<uni-col :span="12" v-for="(item,index) in faultTypeData" :key="index">
+							<view class="gzcs_data_col flex">
+								<view class="gzcs_data_col_left" :style="showColor(item)">
+									<text>{{item.name}}</text>
+								</view>
+								<view class=" gzcs_data_col_right flex justify-between">
+									<text>{{item.data}}</text>
+									<text>次</text>
+								</view>
+							</view>
+						</uni-col>
+					</uni-row>
+				</view>
+				<view class="heji flex" v-if="faultTypeTab === 'JX'">
+					<view class="heji_img">
+						<image src="../../static/jnImage/powerPage/heji.png" mode=""></image>
+					</view>
+					<view class="heji_msg flex justify-between">
+						<view class="heji_msg_tit">
+							<text>公司合计</text>
+						</view>
+						<view class="heji_msg_data flex justify-between">
+							<text>600</text>
+							<text>次</text>
+						</view>
+					</view>
+				</view>
+			</view>
+			<view class="wxss">
+				<view class="flex justify-between">
+					<view class="gzcs_title flex justify-center">
+						<image src="../../static/jnImage/powerPage/powerDayIcon.png" mode=""
+							v-if="faultTypeTab === 'XT'"></image>
+						<image src="../../static/jnImage/powerPage/wuxiang.png" mode="" v-else></image>
+						<text>五项损失</text>
+					</view>
+					<view class="yearTab">
+						<text v-for="(item,index) in yearData" :key="index" @click="changeYearTab(item)"
+							:style="item.showColor ? 'background: #4287FF;color:#fff': ''">{{item.nameZN}}</text>
+					</view>
+				</view>
+				<view class="qiun-chartsPie">
+					<qiun-data-charts type="ring" :opts="opts" :chartData="chartDatawxss" />
+				</view>
+				<view class="gzcs_data">
+					<uni-row class="gzcs_data_row">
+						<uni-col :span="12" v-for="(item,index) in wxssTypeData" :key="index">
+							<view class="gzcs_data_col flex">
+								<view class="gzcs_data_col_left" :style="showColor(item)">
+									<text>{{item.name}}</text>
+								</view>
+								<view class=" gzcs_data_col_right flex justify-between">
+									<text>{{item.data}}</text>
+									<text>次</text>
+								</view>
+							</view>
+						</uni-col>
+					</uni-row>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		onLoad: function() {},
+		data() {
+			return {
+				faultTypeTab: 'XT',
+				faultTypeTabData: [],
+				yearTab: '',
+				yearData: [],
+				chartData: {},
+				chartDatawxss: {},
+				opts: {},
+				faultTypeData: [],
+				wxssTypeData: [],
+				opts: {
+					rotate: false,
+					fontColor: '#909BA9',
+					rotateLock: false,
+					color: ['#5CB2EF', '#3E78C5', '#00299D', '#3EAD9F', '#3F3A99', '#5EAC88', '#5D56D0', '#CD8D23',
+						'#9F65C1', '#FD8974', '#C745B9', '#FF6B3E',
+					],
+					padding: [5, 5, 5, 5],
+					dataLabel: true,
+					enableScroll: false,
+					legend: {
+						show: false,
+					},
+					title: {
+						show: false,
+						name: "",
+						fontSize: 5,
+						color: "#666666"
+					},
+					subtitle: {
+						show: false,
+						name: "",
+						fontSize: 5,
+						color: "#7cb5ec"
+					},
+					extra: {
+						ring: {
+							ringWidth: 20,
+							activeOpacity: 0.5,
+							activeRadius: 10,
+							centerColor: '#202246',
+							offsetAngle: 0,
+							labelWidth: 10,
+							border: false,
+						}
+					}
+				}
+			}
+		},
+		created() {
+			this.faultTypeTabData = [{
+					nameZN: '系统',
+					nameEN: 'XT',
+					showColor: true
+				},
+				{
+					nameZN: '机型',
+					nameEN: 'JX',
+					showColor: false
+
+				}
+			]
+			this.yearData = [{
+					nameZN: '日',
+					nameEN: 'day',
+					showColor: true
+				},
+				{
+					nameZN: '月',
+					nameEN: 'month',
+					showColor: false
+				},
+				{
+					nameZN: '年',
+					nameEN: 'year',
+					showColor: false
+
+				}
+			]
+			this.faultTypeData = [{
+					data: 1865,
+					name: '发电机'
+				},
+				{
+					data: 1865,
+					name: '传动变速'
+				},
+				{
+					data: 696,
+					name: '远程监控'
+				},
+				{
+					data: 527,
+					name: '电气控制'
+				},
+				{
+					data: 935,
+					name: '变桨'
+				},
+				{
+					data: 1022,
+					name: '变频'
+				},
+				{
+					data: 752,
+					name: '电源'
+				},
+				{
+					data: 1520,
+					name: '机舱与塔架'
+				},
+				{
+					data: 365.6,
+					name: '风轮'
+				},
+				{
+					data: 365,
+					name: '偏航'
+				},
+				{
+					data: 256,
+					name: '液压'
+				},
+				{
+					data: 214,
+					name: '通讯'
+				},
+			]
+			this.wxssTypeData = [{
+					data: 1865,
+					name: '发电机'
+				},
+				{
+					data: 1865,
+					name: '传动变速'
+				},
+				{
+					data: 696,
+					name: '远程监控'
+				},
+				{
+					data: 527,
+					name: '电气控制'
+				},
+				{
+					data: 935,
+					name: '变桨'
+				},
+				{
+					data: 1022,
+					name: '变频'
+				}
+			]
+		},
+		onReady() {
+			this.getPieBar()
+			this.getPieBarwxss()
+		},
+		methods: {
+			getPieBar() {
+				let proColor = ['#5CB2EF', '#3E78C5', '#00299D', '#3EAD9F', '#3F3A99', '#5EAC88', '#5D56D0', '#CD8D23',
+					'#9F65C1', '#FD8974', '#C745B9', '#FF6B3E'
+				]
+
+				let series = []
+				this.faultTypeData.forEach((item, index) => {
+					let obj = {
+						name: item.name,
+						value: item.data,
+					}
+					proColor.forEach((it, idx) => {
+						if (index.toString().length > 1) {
+							obj.color = proColor[index.toString().slice(-1)]
+							item.color = proColor[index.toString().slice(-1)]
+						} else {
+							obj.color = proColor[index]
+							item.color = proColor[index]
+						}
+					})
+					series.push(obj)
+				})
+				let res = {
+					series: [{
+						data: series
+					}]
+				};
+				this.chartData = JSON.parse(JSON.stringify(res));
+			},
+			getPieBarwxss() {
+				let proColor = ['#5CB2EF', '#3E78C5', '#00299D', '#3EAD9F', '#3F3A99', '#5EAC88', '#5D56D0', '#CD8D23',
+					'#9F65C1', '#FD8974', '#C745B9', '#FF6B3E'
+				]
+
+				let series = []
+				this.wxssTypeData.forEach((item, index) => {
+					let obj = {
+						name: item.name,
+						value: item.data,
+					}
+					proColor.forEach((it, idx) => {
+						if (index.toString().length > 1) {
+							obj.color = proColor[index.toString().slice(-1)]
+							item.color = proColor[index.toString().slice(-1)]
+						} else {
+							obj.color = proColor[index]
+							item.color = proColor[index]
+						}
+					})
+					series.push(obj)
+				})
+				let res = {
+					series: [{
+						data: series
+					}]
+				};
+				this.chartDatawxss = JSON.parse(JSON.stringify(res));
+			},
+			showColor(item) {
+				return `background: ${item.color}`
+			},
+			changefaultTypeTab(item) {
+				this.faultTypeTabData.forEach(it => {
+					it.showColor = false
+					if (it.nameEN === item.nameEN) {
+						item.showColor = true
+						this.faultTypeTab = it.nameEN
+					}
+				})
+				// if (this.faultTypeTab === 'XT') {
+				// 	this.getPowerBar()
+				// } else {
+				// 	this.getLineBar()
+				// }
+			},
+			changeYearTab(item) {
+				this.yearData.forEach(it => {
+					it.showColor = false
+					if (it.nameEN === item.nameEN) {
+						item.showColor = true
+						this.yearTab = it.nameEN
+					}
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	page {
+		background-color: #202246;
+	}
+
+	.faultType {
+		width: 100vw;
+
+		.home_header {
+			width: calc(100% -32px);
+			display: flex;
+			justify-content: space-between;
+			height: 60px;
+			padding-top: 16px;
+			// position: fixed;
+
+			.header_message {
+				width: 15%;
+
+				image {
+					position: relative;
+					top: 0px;
+					left: 10px;
+					width: 30px;
+					height: 30px;
+				}
+			}
+
+			.header_title {
+				width: 70%;
+				position: relative;
+				left: 10px;
+
+				image {
+					width: 28px;
+					height: 22px;
+					position: relative;
+					top: 5px;
+				}
+
+				.titleName {
+					line-height: 20px;
+					margin-left: 5px;
+					font-size: 36upx;
+					font-family: FZZhengHeiS-M-GB;
+					font-weight: 600;
+					letter-spacing: 2px;
+					color: #fff;
+				}
+			}
+
+			.header_more {
+				width: 15%;
+				position: relative;
+				top: 5px;
+				left: 10px;
+
+				image {
+					width: 30px;
+					height: 20px;
+				}
+			}
+		}
+
+		.faultType_main {
+			padding: 0 20px;
+
+			.faultType_tab {
+				text {
+					display: inline-block;
+					width: 80px;
+					height: 25px;
+					border: 1px solid #4287FF;
+					text-align: center;
+					color: #4287FF;
+					line-height: 25px;
+					letter-spacing: 2px;
+				}
+			}
+
+			.gzcs,
+			.ssdl,
+			.wxss {
+				.gzcs_title {
+					width: 130px;
+					height: 45px;
+					padding-left: 10px;
+					margin-top: 10px;
+					background: linear-gradient(90deg, #333976, #202246);
+					align-items: center;
+
+					image {
+						width: 24px;
+						height: 22px;
+					}
+
+					text {
+						margin-left: 10px;
+						font-size: 16px;
+						color: #fff;
+					}
+				}
+
+				.yearTab {
+					width: 120px;
+					height: 25px;
+					border-radius: 20px;
+					background: #0B143E;
+					margin-top: 20px;
+
+					text {
+						display: inline-block;
+						width: 40px;
+						height: 25px;
+						border-radius: 20px;
+						text-align: center;
+						color: #4287FF;
+						line-height: 25px;
+					}
+				}
+
+				.qiun-chartsPie {
+					width: 100%;
+					height: 200px;
+					margin: 10px 0;
+				}
+
+				.gzcs_data {
+					margin-top: 5px;
+
+					.gzcs_data_row {
+						.gzcs_data_col {
+							width: 98%;
+							height: 20px;
+							margin-bottom: 5px;
+							background: #2E336D;
+
+							.gzcs_data_col_left {
+								width: 50%;
+								height: 20px;
+								color: #fff;
+								font-size: 30upx;
+								background: #3F4572;
+
+								text {
+									margin-left: 5px;
+								}
+							}
+
+							.gzcs_data_col_right {
+								height: 20px;
+								color: #fff;
+								font-size: 32upx;
+								width: 48%;
+
+								text:nth-of-type(1) {
+									margin-left: 5px;
+									width: 50%;
+									font-size: 32upx;
+									color: #fff;
+									position: relative;
+									top: 3px;
+								}
+
+								text:nth-of-type(2) {
+									font-size: 22upx;
+									color: #96B5D5;
+									position: relative;
+									top: 4px;
+								}
+							}
+						}
+					}
+				}
+
+				.heji {
+					width: 100%;
+					height: 30px;
+					background: rgba(67, 89, 255, 0.5);
+
+					.heji_img {
+						width: 20%;
+						height: 30px;
+						border-right: 1px solid rgba(255, 255, 255, 0.5);
+
+						image {
+							width: 24px;
+							height: 22px;
+						}
+					}
+
+					.heji_msg {
+						width: 80%;
+						color: #fff;
+
+						.heji_msg_tit {
+							width: 50%;
+
+							text {
+								margin-left: 15px;
+								font-size: 28upx;
+								position: relative;
+								top: 6px;
+							}
+						}
+
+						.heji_msg_data {
+							width: 50%;
+
+							text:nth-of-type(1) {
+								font-size: 36upx;
+								position: relative;
+								top: 6px;
+							}
+
+							text:nth-of-type(2) {
+								font-size: 22upx;
+								margin-right: 5px;
+								position: relative;
+								top: 8px;
+							}
+						}
+					}
+				}
+			}
+		}
+
+	}
+</style>

pages/warn/index.vue

@@ -0,0 +1,23 @@
+<template>
+	<view class="home">
+
+	</view>
+</template>
+
+<script>
+	export default {
+		onLoad: function() {}
+	}
+</script>
+
+<style lang="scss">
+	page {
+		background-color: #202246;
+	}
+
+	.home {
+		width: 100vw;
+
+
+	}
+</style>

permission.js

@@ -0,0 +1,41 @@
+import {
+	getAccessToken
+} from '@/utils/auth'
+
+// 登录页面
+const loginPage = "/pages/login"
+
+// 页面白名单
+const whiteList = [
+	'/pages/login', '/pages/common/webview/index'
+]
+
+// 检查地址白名单
+function checkWhite(url) {
+	const path = url.split('?')[0]
+	return whiteList.indexOf(path) !== -1
+}
+
+// 页面跳转验证拦截器
+// let list = ["navigateTo", "redirectTo", "reLaunch", "switchTab"]
+// list.forEach(item => {
+//   uni.addInterceptor(item, {
+//     invoke(to) {
+//       if (getAccessToken()) {
+//         if (to.path === loginPage) {
+//           uni.reLaunch({ url: "/" })
+//         }
+//         return true
+//       } else {
+//         if (checkWhite(to.url)) {
+//           return true
+//         }
+//         uni.reLaunch({ url: loginPage })
+//         return false
+//       }
+//     },
+//     fail(err) {
+//       console.log(err)
+//     }
+//   })
+// })

plugins/auth.js

@@ -0,0 +1,60 @@
+import store from '@/store'
+
+function authPermission(permission) {
+  const all_permission = "*:*:*"
+  const permissions = store.getters && store.getters.permissions
+  if (permission && permission.length > 0) {
+    return permissions.some(v => {
+      return all_permission === v || v === permission
+    })
+  } else {
+    return false
+  }
+}
+
+function authRole(role) {
+  const super_admin = "admin"
+  const roles = store.getters && store.getters.roles
+  if (role && role.length > 0) {
+    return roles.some(v => {
+      return super_admin === v || v === role
+    })
+  } else {
+    return false
+  }
+}
+
+export default {
+  // 验证用户是否具备某权限
+  hasPermi(permission) {
+    return authPermission(permission)
+  },
+  // 验证用户是否含有指定权限，只需包含其中一个
+  hasPermiOr(permissions) {
+    return permissions.some(item => {
+      return authPermission(item)
+    })
+  },
+  // 验证用户是否含有指定权限，必须全部拥有
+  hasPermiAnd(permissions) {
+    return permissions.every(item => {
+      return authPermission(item)
+    })
+  },
+  // 验证用户是否具备某角色
+  hasRole(role) {
+    return authRole(role)
+  },
+  // 验证用户是否含有指定角色，只需包含其中一个
+  hasRoleOr(roles) {
+    return roles.some(item => {
+      return authRole(item)
+    })
+  },
+  // 验证用户是否含有指定角色，必须全部拥有
+  hasRoleAnd(roles) {
+    return roles.every(item => {
+      return authRole(item)
+    })
+  }
+}

plugins/index.js

@@ -0,0 +1,14 @@
+import tab from './tab'
+import auth from './auth'
+import modal from './modal'
+
+export default {
+  install(Vue) {
+    // 页签操作
+    Vue.prototype.$tab = tab
+    // 认证对象
+    Vue.prototype.$auth = auth
+    // 模态框对象
+    Vue.prototype.$modal = modal
+  }
+}

plugins/modal.js

@@ -0,0 +1,74 @@
+export default {
+  // 消息提示
+  msg(content) {
+    uni.showToast({
+      title: content,
+      icon: 'none'
+    })
+  },
+  // 错误消息
+  msgError(content) {
+    uni.showToast({
+      title: content,
+      icon: 'error'
+    })
+  },
+  // 成功消息
+  msgSuccess(content) {
+    uni.showToast({
+      title: content,
+      icon: 'success'
+    })
+  },
+  // 隐藏消息
+  hideMsg(content) {
+    uni.hideToast()
+  },
+  // 弹出提示
+  alert(content) {
+    uni.showModal({
+      title: '提示',
+      content: content,
+      showCancel: false
+    })
+  },
+  // 确认窗体
+  confirm(content) {
+    return new Promise((resolve, reject) => {
+      uni.showModal({
+        title: '系统提示',
+        content: content,
+        cancelText: '取消',
+        confirmText: '确定',
+        success: function(res) {
+          if (res.confirm) {
+            resolve(res.confirm)
+          }
+        }
+      })
+    })
+  },
+  // 提示信息
+  showToast(option) {
+    if (typeof option === "object") {
+      uni.showToast(option)
+    } else {
+      uni.showToast({
+        title: option,
+        icon: "none",
+        duration: 2500
+      })
+    }
+  },
+  // 打开遮罩层
+  loading(content) {
+    uni.showLoading({
+      title: content,
+      icon: 'none'
+    })
+  },
+  // 关闭遮罩层
+  closeLoading() {
+    uni.hideLoading()
+  }
+}

plugins/tab.js

@@ -0,0 +1,30 @@
+export default {
+  // 关闭所有页面，打开到应用内的某个页面
+  reLaunch(url) {
+    return uni.reLaunch({
+      url: url
+    })
+  },
+  // 跳转到tabBar页面，并关闭其他所有非tabBar页面
+  switchTab(url) {
+    return uni.switchTab({
+      url: url
+    })
+  },
+  // 关闭当前页面，跳转到应用内的某个页面
+  redirectTo(url) {
+    return uni.redirectTo({
+      url: url
+    })
+  },
+  // 保留当前页面，跳转到应用内的某个页面
+  navigateTo(url) {
+    return uni.navigateTo({
+      url: url
+    })
+  },
+  // 关闭当前页面，返回上一页面或多级页面
+  navigateBack() {
+    return uni.navigateBack()
+  }
+}

static/font/iconfont.css

@@ -0,0 +1,90 @@
+@font-face {
+  font-family: "iconfont";
+  src: url('/static/font/iconfont.ttf') format('truetype');
+}
+
+.iconfont {
+  font-family: "iconfont" !important;
+  font-size: 16px;
+  display: inline-block;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.icon-user:before {
+  content: "\e7ae";
+}
+
+.icon-password:before {
+  content: "\e8b2";
+}
+
+.icon-code:before {
+  content: "\e699";
+}
+
+.icon-setting:before {
+  content: "\e6cc";
+}
+
+.icon-share:before {
+  content: "\e739";
+}
+
+.icon-edit:before {
+  content: "\e60c";
+}
+
+.icon-version:before {
+  content: "\e63f";
+}
+
+.icon-service:before {
+  content: "\e6ff";
+}
+
+.icon-friendfill:before {
+  content: "\e726";
+}
+
+.icon-community:before {
+  content: "\e741";
+}
+
+.icon-people:before {
+  content: "\e736";
+}
+
+.icon-dianzan:before {
+  content: "\ec7f";
+}
+
+.icon-right:before {
+  content: "\e7eb";
+}
+
+.icon-logout:before {
+  content: "\e61d";
+}
+
+.icon-help:before {
+  content: "\e616";
+}
+
+.icon-github:before {
+  content: "\e628";
+}
+
+.icon-aixin:before {
+  content: "\e601";
+}
+
+.icon-clean:before {
+  content: "\e607";
+}
+
+.icon-refresh:before {
+  content: "\e604";
+}
+

static/index.html

@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+	<head>
+		<meta charset="utf-8">
+		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+		  <meta name="renderer" content="webkit">
+		<title><%= htmlWebpackPlugin.options.title %></title>
+    <link rel="shortcut icon" type="image/x-icon" href="<%= BASE_URL %>static/favicon.ico">
+		<script>
+			var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') || CSS.supports('top: constant(a)'))
+			document.write('<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' + (coverSupport ? ', viewport-fit=cover' : '') + '" />')
+		</script>
+		<link rel="stylesheet" href="<%= BASE_URL %>static/index.<%= VUE_APP_INDEX_CSS_HASH %>.css" />
+	</head>
+	<body>
+		<noscript>
+			<strong>本站点必须要开启JavaScript才能运行.</strong>
+		</noscript>
+		<div id="app"></div>
+</html>

static/scss/global.scss

@@ -0,0 +1,90 @@
+.text-center {
+	text-align: center;
+}
+
+.font-13 {
+	font-size: 13px;
+}
+
+.font-12 {
+	font-size: 12px;
+}
+
+.font-11 {
+	font-size: 11px;
+}
+
+.text-grey1 {
+	color: #888;
+}
+.text-grey2 {
+	color: #aaa;
+}
+
+.list-cell-arrow::before {
+    content: ' ';
+    height: 10px;
+    width: 10px;
+    border-width: 2px 2px 0 0;
+    border-color: #c0c0c0;
+    border-style: solid;
+    -webkit-transform: matrix(0.5, 0.5, -0.5, 0.5, 0, 0);
+    transform: matrix(0.5, 0.5, -0.5, 0.5, 0, 0);
+    position: absolute;
+    top: 50%;
+    margin-top: -6px;
+    right: 30rpx;
+  }
+  
+  .list-cell {
+    position: relative;
+    width: 100%;
+    box-sizing: border-box;
+    background-color: #fff;
+    color: #333;
+    padding: 26rpx 30rpx;
+  }
+  
+  .list-cell:first-child {
+    border-radius: 8rpx 8rpx 0 0;
+  }
+  
+  .list-cell:last-child {
+    border-radius: 0 0 8rpx 8rpx;
+  }
+  
+  .list-cell::after {
+    content: '';
+    position: absolute;
+    border-bottom: 1px solid #eaeef1;
+    -webkit-transform: scaleY(0.5) translateZ(0);
+    transform: scaleY(0.5) translateZ(0);
+    transform-origin: 0 100%;
+    bottom: 0;
+    right: 0;
+    left: 0;
+    pointer-events: none;
+  }
+  
+  
+  .menu-list {
+    margin: 15px 15px;
+  
+    .menu-item-box {
+      width: 100%;
+      display: flex;
+      align-items: center;
+  
+      .menu-icon {
+        color: #007AFF;
+        font-size: 16px;
+        margin-right: 5px;
+      }
+      
+      .text-right {
+        margin-left: auto;
+        margin-right: 34rpx;
+        color: #999;
+      }
+    }
+  }

static/scss/index.scss

@@ -0,0 +1,6 @@
+// global
+@import "./global.scss";
+// color-ui
+@import "@/static/scss/colorui.css";
+// iconfont
+@import "@/static/font/iconfont.css";

store/getters.js

@@ -0,0 +1,8 @@
+const getters = {
+  token: state => state.user.token,
+  avatar: state => state.user.avatar,
+  name: state => state.user.name,
+  roles: state => state.user.roles,
+  permissions: state => state.user.permissions
+}
+export default getters

store/index.js

@@ -0,0 +1,15 @@
+import Vue from 'vue'
+import Vuex from 'vuex'
+import user from '@/store/modules/user'
+import getters from './getters'
+
+Vue.use(Vuex)
+
+const store = new Vuex.Store({
+  modules: {
+    user
+  },
+  getters
+})
+
+export default store

store/modules/user.js

@@ -0,0 +1,98 @@
+import config from '@/config'
+import storage from '@/utils/storage'
+import constant from '@/utils/constant'
+import { login, logout, getInfo } from '@/api/login'
+import { setToken, removeToken } from '@/utils/auth'
+
+const baseUrl = config.baseUrl
+
+const user = {
+  state: {
+    id: 0, // 用户编号
+    name: storage.get(constant.name),
+    avatar: storage.get(constant.avatar),
+    roles: storage.get(constant.roles),
+    permissions: storage.get(constant.permissions)
+  },
+
+  mutations: {
+    SET_ID: (state, id) => {
+      state.id = id
+    },
+    SET_NAME: (state, name) => {
+      state.name = name
+      storage.set(constant.name, name)
+    },
+    SET_AVATAR: (state, avatar) => {
+      state.avatar = avatar
+      storage.set(constant.avatar, avatar)
+    },
+    SET_ROLES: (state, roles) => {
+      state.roles = roles
+      storage.set(constant.roles, roles)
+    },
+    SET_PERMISSIONS: (state, permissions) => {
+      state.permissions = permissions
+      storage.set(constant.permissions, permissions)
+    }
+  },
+
+  actions: {
+    // 登录
+    Login({ commit }, userInfo) {
+      const username = userInfo.username.trim()
+      const password = userInfo.password
+      const captchaVerification = userInfo.captchaVerification
+      return new Promise((resolve, reject) => {
+        login(username, password, captchaVerification).then(res => {
+          res = res.data;
+          // 设置 token
+          setToken(res)
+          resolve()
+        }).catch(error => {
+          reject(error)
+        })
+      })
+    },
+
+    // 获取用户信息
+    GetInfo({ commit, state }) {
+      return new Promise((resolve, reject) => {
+        getInfo().then(res => {
+          res = res.data; // 读取 data 数据
+          const user = res.user
+          const avatar = (user == null || user.avatar === "" || user.avatar == null) ? require("@/static/images/profile.jpg") : user.avatar
+          const nickname = (user == null || user.nickname === "" || user.nickname == null) ? "" : user.nickname
+          if (res.roles && res.roles.length > 0) {
+            commit('SET_ROLES', res.roles)
+            commit('SET_PERMISSIONS', res.permissions)
+          } else {
+            commit('SET_ROLES', ['ROLE_DEFAULT'])
+          }
+          commit('SET_NAME', nickname)
+          commit('SET_AVATAR', avatar)
+          resolve(res)
+        }).catch(error => {
+          reject(error)
+        })
+      })
+    },
+
+    // 退出系统
+    LogOut({ commit, state }) {
+      return new Promise((resolve, reject) => {
+        logout(state.token).then(() => {
+          commit('SET_ROLES', [])
+          commit('SET_PERMISSIONS', [])
+          removeToken()
+          storage.clean()
+          resolve()
+        }).catch(error => {
+          reject(error)
+        })
+      })
+    }
+  }
+}
+
+export default user

uni.scss

@@ -0,0 +1,64 @@
+/**
+ * uni-app内置的常用样式变量
+ */
+
+/* 行为相关颜色 */
+$uni-color-primary: #007aff;
+$uni-color-success: #4cd964;
+$uni-color-warning: #f0ad4e;
+$uni-color-error: #dd524d;
+
+/* 文字基本颜色 */
+$uni-text-color:#333;//基本色
+$uni-text-color-inverse:#fff;//反色
+$uni-text-color-grey:#999;//辅助灰色，如加载更多的提示信息
+$uni-text-color-placeholder: #808080;
+$uni-text-color-disable:#c0c0c0;
+
+/* 背景颜色 */
+$uni-bg-color:#ffffff;
+$uni-bg-color-grey:#f8f8f8;
+$uni-bg-color-hover:#f1f1f1;//点击状态颜色
+$uni-bg-color-mask:rgba(0, 0, 0, 0.4);//遮罩颜色
+
+/* 边框颜色 */
+$uni-border-color:#e5e5e5;
+
+/* 尺寸变量 */
+
+/* 文字尺寸 */
+$uni-font-size-sm:12px;
+$uni-font-size-base:14px;
+$uni-font-size-lg:16px;
+
+/* 图片尺寸 */
+$uni-img-size-sm:20px;
+$uni-img-size-base:26px;
+$uni-img-size-lg:40px;
+
+/* Border Radius */
+$uni-border-radius-sm: 2px;
+$uni-border-radius-base: 3px;
+$uni-border-radius-lg: 6px;
+$uni-border-radius-circle: 50%;
+
+/* 水平间距 */
+$uni-spacing-row-sm: 5px;
+$uni-spacing-row-base: 10px;
+$uni-spacing-row-lg: 15px;
+
+/* 垂直间距 */
+$uni-spacing-col-sm: 4px;
+$uni-spacing-col-base: 8px;
+$uni-spacing-col-lg: 12px;
+
+/* 透明度 */
+$uni-opacity-disabled: 0.3; // 组件禁用态的透明度
+
+/* 文章场景相关 */
+$uni-color-title: #2C405A; // 文章标题颜色
+$uni-font-size-title:20px;
+$uni-color-subtitle: #555555; // 二级标题颜色
+$uni-font-size-subtitle:26px;
+$uni-color-paragraph: #3F536E; // 文章段落颜色
+$uni-font-size-paragraph:15px;

uni_modules/qiun-data-charts/changelog.md

@@ -0,0 +1,320 @@
+## 2.5.0-20230101（2023-01-01）
+- 秋云图表组件 修改条件编译顺序，确保uniapp的cli方式的项目依赖不完整时可以正常显示
+- 秋云图表组件 恢复props属性directory的使用，以修复vue3项目中，开启echarts后，echarts目录识别错误的bug
+- uCharts.js 修复区域图、混合图只有一个数据时图表显示不正确的bug
+- uCharts.js 修复折线图、区域图中时间轴类别图表tooltip指示点显示不正确的bug
+- uCharts.js 修复x轴使用labelCount时，并且boundaryGap = 'justify' 并且关闭Y轴显示的时候，最后一个坐标值不显示的bug
+- uCharts.js 修复折线图只有一组数据时 ios16 渲染颜色不正确的bug
+- uCharts.js 修复玫瑰图半径显示不正确的bug
+- uCharts.js 柱状图、山峰图增加正负图功能，y轴网格如果需要显示0轴则由 min max 及 splitNumber 确定，后续版本优化自动显示0轴
+- uCharts.js 柱状图column增加 opts.extra.column.labelPosition，数据标签位置，有效值为 outside外部, insideTop内顶部, center内中间, bottom内底部
+- uCharts.js 雷达图radar增加 opts.extra.radar.labelShow，否显示各项标识文案是，默认true
+- uCharts.js 提示窗tooltip增加 opts.extra.tooltip.boxPadding，提示窗边框填充距离，默认3px
+- uCharts.js 提示窗tooltip增加 opts.extra.tooltip.fontSize，提示窗字体大小配置，默认13px
+- uCharts.js 提示窗tooltip增加 opts.extra.tooltip.lineHeight，提示窗文字行高，默认20px
+- uCharts.js 提示窗tooltip增加 opts.extra.tooltip.legendShow，是否显示左侧图例，默认true
+- uCharts.js 提示窗tooltip增加 opts.extra.tooltip.legendShape，图例形状，图例标识样式，有效值为 auto自动跟随图例, diamond◆, circle●, triangle▲, square■, rect▬, line-
+- uCharts.js 标记线markLine增加 opts.extra.markLine.labelFontSize，字体大小配置，默认13px
+- uCharts.js 标记线markLine增加 opts.extra.markLine.labelPadding，标签边框内填充距离，默认6px
+- uCharts.js 折线图line增加 opts.extra.line.linearType，渐变色类型，可选值 none关闭渐变色，custom 自定义渐变色。使用自定义渐变色时请赋值serie.linearColor作为颜色值
+- uCharts.js 折线图line增加 serie.linearColor，渐变色数组，格式为2维数组[起始位置，颜色值]，例如[[0,'#0EE2F8'],[0.3,'#2BDCA8'],[0.6,'#1890FF'],[1,'#9A60B4']]
+- uCharts.js 折线图line增加 opts.extra.line.onShadow，是否开启折线阴影，开启后请赋值serie.setShadow阴影设置
+- uCharts.js 折线图line增加 serie.setShadow，阴影配置，格式为4位数组：[offsetX,offsetY,blur,color]
+- uCharts.js 折线图line增加 opts.extra.line.animation，动画效果方向，可选值为vertical 垂直动画效果，horizontal 水平动画效果
+- uCharts.js X轴xAxis增加 opts.xAxis.lineHeight，X轴字体行高，默认20px
+- uCharts.js X轴xAxis增加 opts.xAxis.marginTop，X轴文字距离轴线的距离，默认0px
+- uCharts.js X轴xAxis增加 opts.xAxis.title，当前X轴标题
+- uCharts.js X轴xAxis增加 opts.xAxis.titleFontSize，标题字体大小，默认13px
+- uCharts.js X轴xAxis增加 opts.xAxis.titleOffsetY，标题纵向偏移距离，负数为向上偏移，正数向下偏移
+- uCharts.js X轴xAxis增加 opts.xAxis.titleOffsetX，标题横向偏移距离，负数为向左偏移，正数向右偏移
+- uCharts.js X轴xAxis增加 opts.xAxis.titleFontColor，标题字体颜色，默认#666666
+
+## 报错TypeError: Cannot read properties of undefined (reading 'length')
+- 如果是uni-modules版本组件，请先登录HBuilderX账号；
+- 在HBuilderX中的manifest.json，点击重新获取uniapp的appid，或者删除appid重新粘贴，重新运行；
+- 如果是cli项目请使用码云上的非uniCloud版本组件；
+- 或者添加uniCloud的依赖；
+- 或者使用原生uCharts；
+## 2.4.5-20221130（2022-11-30）
+- uCharts.js 优化tooltip当文字很多变为左侧显示时，如果画布仍显显示不下，提示框错位置变为以左侧0位置起画
+- uCharts.js 折线图修复特殊情况下只有单点数据，并改变线宽后点变为圆形的bug
+- uCharts.js 修复Y轴disabled启用后无效并报错的bug
+- uCharts.js 修复仪表盘起始结束角度特殊情况下显示不正确的bug
+- uCharts.js 雷达图新增参数 opts.extra.radar.radius , 自定义雷达图半径
+- uCharts.js 折线图、区域图增加tooltip指示点，opts.extra.line.activeType/opts.extra.area.activeType，可选值"none"不启用激活指示点,"hollow"空心点模式,"solid"实心点模式
+## 2.4.4-20221102（2022-11-02）
+- 秋云图表组件 修复使用echarts时reload、reshow无法调用重新渲染的bug，[详见码云PR](https://gitee.com/uCharts/uCharts/pulls/40)
+- 秋云图表组件 修复使用echarts时，初始化时宽高不正确的bug，[详见码云PR](https://gitee.com/uCharts/uCharts/pulls/42)
+- 秋云图表组件 修复uniapp的h5使用history模式时，无法加载echarts的bug
+- 秋云图表组件 小程序端@complete、@scrollLeft、@scrollRight、@getTouchStart、@getTouchMove、@getTouchEnd事件增加opts参数传出，方便一些特殊需求的交互获取数据。
+
+- uCharts.js 修复calTooltipYAxisData方法内formatter格式化方法未与y轴方法同步的问题，[详见码云PR](https://gitee.com/uCharts/uCharts/pulls/43)
+- uCharts.js 地图新增参数opts.series[i].fillOpacity，以透明度方式来设置颜色过度效果，[详见码云PR](https://gitee.com/uCharts/uCharts/pulls/38)
+- uCharts.js 地图新增参数opts.extra.map.active，是否启用点击激活变色
+- uCharts.js 地图新增参数opts.extra.map.activeTextColor，是否启用点击激活变色
+- uCharts.js 地图新增渲染完成事件renderComplete
+- uCharts.js 漏斗图修复当部分数据相同时tooltip提示窗点击错误的bug
+- uCharts.js 漏斗图新增参数series.data[i].centerText 居中标签文案
+- uCharts.js 漏斗图新增参数series.data[i].centerTextSize 居中标签文案字体大小，默认opts.fontSize
+- uCharts.js 漏斗图新增参数series.data[i].centerTextColor 居中标签文案字体颜色，默认#FFFFFF
+- uCharts.js 漏斗图新增参数opts.extra.funnel.minSize 最小值的最小宽度，默认0
+- uCharts.js 进度条新增参数opts.extra.arcbar.direction，动画方向，可选值为cw顺时针、ccw逆时针
+- uCharts.js 混合图新增参数opts.extra.mix.line.width，折线的宽度，默认2
+- uCharts.js 修复tooltip开启horizentalLine水平横线标注时，图表显示错位的bug
+- uCharts.js 优化tooltip当文字很多变为左侧显示时，如果画布仍显显示不下，提示框错位置变为以左侧0位置起画
+- uCharts.js 修复开启滚动条后X轴文字超出绘图区域后的隐藏逻辑
+- uCharts.js 柱状图、条状图修复堆叠模式不能通过{value,color}赋值单个柱子颜色的问题
+- uCharts.js 气泡图修复不识别series.textSize和series.textColor的bug
+
+## 报错TypeError: Cannot read properties of undefined (reading 'length')
+1. 如果是uni-modules版本组件，请先登录HBuilderX账号；
+2. 在HBuilderX中的manifest.json，点击重新获取uniapp的appid，或者删除appid重新粘贴，重新运行；
+3. 如果是cli项目请使用码云上的非uniCloud版本组件；
+4. 或者添加uniCloud的依赖；
+5. 或者使用原生uCharts；
+## 2.4.3-20220505（2022-05-05）
+- 秋云图表组件 修复开启canvas2d后将series赋值为空数组显示加载图标时，再次赋值后画布闪动的bug
+- 秋云图表组件 修复升级hbx最新版后ECharts的highlight方法报错的bug
+- uCharts.js 雷达图新增参数opts.extra.radar.gridEval，数据点位网格抽希，默认1
+- uCharts.js 雷达图新增参数opts.extra.radar.axisLabel，	是否显示刻度点值，默认false
+- uCharts.js 雷达图新增参数opts.extra.radar.axisLabelTofix，刻度点值小数位数，默认0
+- uCharts.js 雷达图新增参数opts.extra.radar.labelPointShow，是否显示末端刻度圆点，默认false
+- uCharts.js 雷达图新增参数opts.extra.radar.labelPointRadius，刻度圆点的半径，默认3
+- uCharts.js 雷达图新增参数opts.extra.radar.labelPointColor，刻度圆点的颜色，默认#cccccc
+- uCharts.js 雷达图新增参数opts.extra.radar.linearType，渐变色类型，可选值"none"关闭渐变,"custom"开启渐变
+- uCharts.js 雷达图新增参数opts.extra.radar.customColor，自定义渐变颜色，数组类型对应series的数组长度以匹配不同series颜色的不同配色方案，例如["#FA7D8D", "#EB88E2"]
+- uCharts.js 雷达图优化支持series.textColor、series.textSize属性
+- uCharts.js 柱状图中温度计式图标，优化支持全圆角类型，修复边框有缝隙的bug，详见官网【演示】中的温度计图表
+- uCharts.js 柱状图新增参数opts.extra.column.activeWidth，当前点击柱状图的背景宽度，默认一个单元格单位
+- uCharts.js 混合图增加opts.extra.mix.area.gradient 区域图是否开启渐变色
+- uCharts.js 混合图增加opts.extra.mix.area.opacity 区域图透明度，默认0.2
+- uCharts.js 饼图、圆环图、玫瑰图、漏斗图，增加opts.series[0].data[i].labelText，自定义标签文字，避免formatter格式化的繁琐，详见官网【演示】中的饼图
+- uCharts.js 饼图、圆环图、玫瑰图、漏斗图，增加opts.series[0].data[i].labelShow，自定义是否显示某一个指示标签，避免因饼图类别太多导致标签重复或者居多导致图形变形的问题，详见官网【演示】中的饼图
+- uCharts.js 增加opts.series[i].legendText/opts.series[0].data[i].legendText（与series.name同级）自定义图例显示文字的方法
+- uCharts.js 优化X轴、Y轴formatter格式化方法增加形参，统一为fromatter:function(value,index,opts){}
+- uCharts.js 修复横屏模式下无法使用双指缩放方法的bug
+- uCharts.js 修复当只有一条数据或者多条数据值相等的时候Y轴自动计算的最大值错误的bug
+- 【官网模板】增加外部自定义图例与图表交互的例子，[点击跳转](https://www.ucharts.cn/v2/#/layout/info?id=2)
+
+## 注意：非unimodules 版本如因更新 hbx 至 3.4.7 导致报错如下，请到码云更新非 unimodules 版本组件，[点击跳转](https://gitee.com/uCharts/uCharts/tree/master/uni-app/uCharts-%E7%BB%84%E4%BB%B6)
+> Error in callback for immediate watcher "uchartsOpts": "SyntaxError: Unexpected token u in JSON at position 0"
+## 2.4.2-20220421（2022-04-21）
+- 秋云图表组件 修复HBX升级3.4.6.20220420版本后echarts报错的问题
+## 2.4.2-20220420（2022-04-20）
+## 重要！此版本uCharts新增了很多功能，修复了诸多已知问题
+- 秋云图表组件 新增onzoom开启双指缩放功能（仅uCharts），前提需要直角坐标系类图表类型，并且ontouch为true、opts.enableScroll为true，详见实例项目K线图
+- 秋云图表组件 新增optsWatch是否监听opts变化，关闭optsWatch后，动态修改opts不会触发图表重绘
+- 秋云图表组件 修复开启canvas2d功能后，动态更新数据后画布闪动的bug
+- 秋云图表组件 去除directory属性，改为自动获取echarts.min.js路径（升级不受影响）
+- 秋云图表组件 增加getImage()方法及@getImage事件，通过ref调用getImage()方法获，触发@getImage事件获取当前画布的base64图片文件流。
+- 秋云图表组件 支付宝、字节跳动、飞书、快手小程序支持开启canvas2d同层渲染设置。
+- 秋云图表组件 新增加【非uniCloud】版本组件，避免有些不需要uniCloud的使用组件发布至小程序需要提交隐私声明问题，请到码云[【非uniCloud版本】](https://gitee.com/uCharts/uCharts/tree/master/uni-app/uCharts-%E7%BB%84%E4%BB%B6)，或npm[【非uniCloud版本】](https://www.npmjs.com/package/@qiun/uni-ucharts)下载使用。
+- uCharts.js 新增dobuleZoom双指缩放功能
+- uCharts.js 新增山峰图type="mount"，数据格式为饼图类格式，不需要传入categories，具体详见新版官网在线演示
+- uCharts.js 修复折线图当数据中存在null时tooltip报错的bug
+- uCharts.js 修复饼图类当画布比较小时自动计算的半径是负数报错的bug
+- uCharts.js 统一各图表类型的series.formatter格式化方法的形参为(val, index, series, opts)，方便格式化时有更多参数可用
+- uCharts.js 标记线功能增加labelText自定义显示文字，增加labelAlign标签显示位置（左侧或右侧），增加标签显示位置微调labelOffsetX、labelOffsetY
+- uCharts.js 修复条状图当数值很小时开启圆角后样式错误的bug
+- uCharts.js 修复X轴开启disabled后，X轴仍占用空间的bug
+- uCharts.js 修复X轴开启滚动条并且开启rotateLabel后，X轴文字与滚动条重叠的bug
+- uCharts.js 增加X轴rotateAngle文字旋转自定义角度，取值范围(-90至90)
+- uCharts.js 修复地图文字标签层级显示不正确的bug
+- uCharts.js 修复饼图、圆环图、玫瑰图当数据全部为0的时候不显示数据标签的bug
+- uCharts.js 修复当opts.padding上边距为0时，Y轴顶部刻度标签位置不正确的bug
+
+## 另外我们还开发了各大原生小程序组件，已发布至码云和npm
+[https://gitee.com/uCharts/uCharts](https://gitee.com/uCharts/uCharts)
+[https://www.npmjs.com/~qiun](https://www.npmjs.com/~qiun)
+
+## 对于原生uCharts文档我们已上线新版官方网站，详情点击下面链接进入官网
+[https://www.uCharts.cn/v2/](https://www.ucharts.cn/v2/)
+## 2.3.7-20220122（2022-01-22）
+## 重要！使用vue3编译，请使用cli模式并升级至最新依赖，HbuilderX编译需要使用3.3.8以上版本
+- uCharts.js 修复uni-app平台组件模式使用vue3编译到小程序报错的bug。
+## 2.3.7-20220118（2022-01-18）
+## 注意，使用vue3的前提是需要3.3.8.20220114-alpha版本的HBuilder！
+## 2.3.67-20220118（2022-01-18）
+- 秋云图表组件 组件初步支持vue3，全端编译会有些问题，具体详见下面修改：
+1. 小程序端运行时，在uni_modules文件夹的qiun-data-charts.js中搜索 new uni_modules_qiunDataCharts_js_sdk_uCharts_uCharts.uCharts，将.uCharts去掉。
+2. 小程序端发行时，在uni_modules文件夹的qiun-data-charts.js中搜索 new e.uCharts，将.uCharts去掉，变为 new e。
+3. 如果觉得上述步骤比较麻烦，如果您的项目只编译到小程序端，可以修改u-charts.js最后一行导出方式，将 export default uCharts;变更为 export default { uCharts: uCharts }; 这样变更后，H5和App端的renderjs会有问题，请开发者自行选择。（此问题非组件问题，请等待DC官方修复Vue3的小程序端）
+## 2.3.6-20220111（2022-01-11）
+- 秋云图表组件 修改组件 props 属性中的 background 默认值为 rgba(0,0,0,0)
+## 2.3.6-20211201（2021-12-01）
+- uCharts.js 修复bar条状图开启圆角模式时，值很小时圆角渲染错误的bug
+## 2.3.5-20211014（2021-10-15）
+- uCharts.js 增加vue3的编译支持（仅原生uCharts，qiun-data-charts组件后续会支持，请关注更新）
+## 2.3.4-20211012（2021-10-12）
+- 秋云图表组件 修复 mac os x 系统 mouseover 事件丢失的 bug
+## 2.3.3-20210706（2021-07-06）
+- uCharts.js 增加雷达图开启数据点值（opts.dataLabel）的显示
+## 2.3.2-20210627（2021-06-27）
+- 秋云图表组件 修复tooltipCustom个别情况下传值不正确报错TypeError: Cannot read property 'name' of undefined的bug
+## 2.3.1-20210616（2021-06-16）
+- uCharts.js 修复圆角柱状图使用4角圆角时，当数值过大时不正确的bug
+## 2.3.0-20210612（2021-06-12）
+- uCharts.js 【重要】uCharts增加nvue兼容，可在nvue项目中使用gcanvas组件渲染uCharts，[详见码云uCharts-demo-nvue](https://gitee.com/uCharts/uCharts)
+- 秋云图表组件 增加tapLegend属性，是否开启图例点击交互事件
+- 秋云图表组件 getIndex事件中增加返回uCharts实例中的opts参数，以便在页面中调用参数
+- 示例项目 pages/other/other.vue增加app端自定义tooltip的方法，详见showOptsTooltip方法
+## 2.2.1-20210603（2021-06-03）
+- uCharts.js 修复饼图、圆环图、玫瑰图，当起始角度不为0时，tooltip位置不准确的bug
+- uCharts.js 增加温度计式柱状图开启顶部半圆形的配置
+## 2.2.0-20210529（2021-05-29）
+- uCharts.js 增加条状图type="bar"
+- 示例项目 pages/ucharts/ucharts.vue增加条状图的demo
+## 2.1.7-20210524（2021-05-24）
+- uCharts.js 修复大数据量模式下曲线图不平滑的bug
+## 2.1.6-20210523（2021-05-23）
+- 秋云图表组件 修复小程序端开启滚动条更新数据后滚动条位置不符合预期的bug
+## 2.1.5-2021051702（2021-05-17）
+- uCharts.js 修复自定义Y轴min和max值为0时不能正确显示的bug
+## 2.1.5-20210517（2021-05-17）
+- uCharts.js 修复Y轴自定义min和max时，未按指定的最大值最小值显示坐标轴刻度的bug
+## 2.1.4-20210516（2021-05-16）
+- 秋云图表组件 优化onWindowResize防抖方法
+- 秋云图表组件 修复APP端uCharts更新数据时，清空series显示loading图标后再显示图表，图表抖动的bug
+- uCharts.js 修复开启canvas2d后，x轴、y轴、series自定义字体大小未按比例缩放的bug
+- 示例项目 修复format-e.vue拼写错误导致app端使用uCharts渲染图表
+## 2.1.3-20210513（2021-05-13）
+- 秋云图表组件 修改uCharts变更chartData数据为updateData方法，支持带滚动条的数据动态打点
+- 秋云图表组件 增加onWindowResize防抖方法 fix by ど誓言，如尘般染指流年づ 
+- 秋云图表组件 H5或者APP变更chartData数据显示loading图表时，原数据闪现的bug
+- 秋云图表组件 props增加errorReload禁用错误点击重新加载的方法
+- uCharts.js 增加tooltip显示category（x轴对应点位）标题的功能，opts.extra.tooltip.showCategory，默认为false
+- uCharts.js 修复mix混合图只有柱状图时，tooltip的分割线显示位置不正确的bug
+- uCharts.js 修复开启滚动条，图表在拖动中动态打点，滚动条位置不正确的bug
+- uCharts.js 修复饼图类数据格式为echarts数据格式，series为空数组报错的bug
+- 示例项目 修改uCharts.js更新到v2.1.2版本后，@getIndex方法获取索引值变更为e.currentIndex.index
+- 示例项目 pages/updata/updata.vue增加滚动条拖动更新（数据动态打点）的demo
+- 示例项目 pages/other/other.vue增加errorReload禁用错误点击重新加载的demo
+## 2.1.2-20210509（2021-05-09）
+秋云图表组件 修复APP端初始化时就传入chartData或lacaldata不显示图表的bug
+## 2.1.1-20210509（2021-05-09）
+- 秋云图表组件 变更ECharts的eopts配置在renderjs内执行，支持在config-echarts.js配置文件内写function配置。
+- 秋云图表组件 修复APP端报错Prop being mutated: "onmouse"错误的bug。
+- 秋云图表组件 修复APP端报错Error: Not Found：Page[6][-1,27] at view.umd.min.js:1的bug。
+## 2.1.0-20210507（2021-05-07）
+- 秋云图表组件 修复初始化时就有数据或者数据更新的时候loading加载动画闪动的bug
+- uCharts.js 修复x轴format方法categories为字符串类型时返回NaN的bug
+- uCharts.js 修复series.textColor、legend.fontColor未执行全局默认颜色的bug
+## 2.1.0-20210506（2021-05-06）
+- 秋云图表组件 修复极个别情况下报错item.properties undefined的bug
+- 秋云图表组件 修复极个别情况下关闭加载动画reshow不起作用，无法显示图表的bug
+- 示例项目 pages/ucharts/ucharts.vue 增加时间轴折线图（type="tline"）、时间轴区域图（type="tarea"）、散点图（type="scatter"）、气泡图demo（type="bubble"）、倒三角形漏斗图（opts.extra.funnel.type="triangle"）、金字塔形漏斗图（opts.extra.funnel.type="pyramid"）
+- 示例项目 pages/format-u/format-u.vue 增加X轴format格式化示例
+- uCharts.js 升级至v2.1.0版本
+- uCharts.js 修复 玫瑰图面积模式点击tooltip位置不正确的bug
+- uCharts.js 修复 玫瑰图点击图例，只剩一个类别显示空白的bug
+- uCharts.js 修复 饼图类图点击图例，其他图表tooltip位置某些情况下不准的bug
+- uCharts.js 修复 x轴为矢量轴（时间轴）情况下，点击tooltip位置不正确的bug
+- uCharts.js 修复 词云图获取点击索引偶尔不准的bug
+- uCharts.js 增加 直角坐标系图表X轴format格式化方法（原生uCharts.js用法请使用formatter）
+- uCharts.js 增加 漏斗图扩展配置，倒三角形（opts.extra.funnel.type="triangle"），金字塔形（opts.extra.funnel.type="pyramid"）
+- uCharts.js 增加 散点图（opts.type="scatter"）、气泡图（opts.type="bubble"）
+- 后期计划 完善散点图、气泡图，增加markPoints标记点，增加横向条状图。
+## 2.0.0-20210502（2021-05-02）
+- uCharts.js 修复词云图获取点击索引不正确的bug
+## 2.0.0-20210501（2021-05-01）
+- 秋云图表组件 修复QQ小程序、百度小程序在关闭动画效果情况下，v-for循环使用图表，显示不正确的bug
+## 2.0.0-20210426（2021-04-26）
+- 秋云图表组件 修复QQ小程序不支持canvas2d的bug
+- 秋云图表组件 修复钉钉小程序某些情况点击坐标计算错误的bug
+- uCharts.js 增加 extra.column.categoryGap 参数，柱状图类每个category点位（X轴点）柱子组之间的间距
+- uCharts.js 增加 yAxis.data[i].titleOffsetY 参数，标题纵向偏移距离，负数为向上偏移，正数向下偏移
+- uCharts.js 增加 yAxis.data[i].titleOffsetX 参数，标题横向偏移距离，负数为向左偏移，正数向右偏移
+- uCharts.js 增加 extra.gauge.labelOffset 参数，仪表盘标签文字径向便宜距离，默认13px
+## 2.0.0-20210422-2（2021-04-22）
+秋云图表组件 修复 formatterAssign 未判断 args[key] == null 的情况导致栈溢出的 bug
+## 2.0.0-20210422（2021-04-22）
+- 秋云图表组件 修复H5、APP、支付宝小程序、微信小程序canvas2d模式下横屏模式的bug
+## 2.0.0-20210421（2021-04-21）
+- uCharts.js 修复多行图例的情况下，图例在上方或者下方时，图例float为左侧或者右侧时，第二行及以后的图例对齐方式不正确的bug
+## 2.0.0-20210420（2021-04-20）
+- 秋云图表组件 修复微信小程序开启canvas2d模式后，windows版微信小程序不支持canvas2d模式的bug
+- 秋云图表组件 修改非uni_modules版本为v2.0版本qiun-data-charts组件
+## 2.0.0-20210419（2021-04-19）
+## v1.0版本已停更，建议转uni_modules版本组件方式调用，点击右侧绿色【使用HBuilderX导入插件】即可使用，示例项目请点击右侧蓝色按钮【使用HBuilderX导入示例项目】。
+## 初次使用如果提示未注册<qiun-data-charts>组件，请重启HBuilderX，如仍不好用，请重启电脑；
+## 如果是cli项目，请尝试清理node_modules，重新install，还不行就删除项目，再重新install。
+## 此问题已于DCloud官方确认，HBuilderX下个版本会修复。
+## 其他图表不显示问题详见[常见问题选项卡](https://demo.ucharts.cn)
+## <font color=#FF0000> 新手请先完整阅读帮助文档及常见问题3遍，右侧蓝色按钮示例项目请看2遍！ </font> 
+## [DEMO演示及在线生成工具（v2.0文档）https://demo.ucharts.cn](https://demo.ucharts.cn)
+## [图表组件在项目中的应用参见 UReport数据报表](https://ext.dcloud.net.cn/plugin?id=4651) 
+- uCharts.js 修复混合图中柱状图单独设置颜色不生效的bug
+- uCharts.js 修复多Y轴单独设置fontSize时，开启canvas2d后，未对应放大字体的bug
+## 2.0.0-20210418（2021-04-18）
+- 秋云图表组件 增加directory配置，修复H5端history模式下如果发布到二级目录无法正确加载echarts.min.js的bug
+## 2.0.0-20210416（2021-04-16）
+## v1.0版本已停更，建议转uni_modules版本组件方式调用，点击右侧绿色【使用HBuilderX导入插件】即可使用，示例项目请点击右侧蓝色按钮【使用HBuilderX导入示例项目】。
+## 初次使用如果提示未注册&lt;qiun-data-charts&gt;组件，请重启HBuilderX，如仍不好用，请重启电脑；
+## 如果是cli项目，请尝试清理node_modules，重新install，还不行就删除项目，再重新install。
+## 此问题已于DCloud官方确认，HBuilderX下个版本会修复。
+## 其他图表不显示问题详见[常见问题选项卡](https://demo.ucharts.cn)
+## <font color=#FF0000> 新手请先完整阅读帮助文档及常见问题3遍，右侧蓝色按钮示例项目请看2遍！ </font> 
+## [DEMO演示及在线生成工具（v2.0文档）https://demo.ucharts.cn](https://demo.ucharts.cn)
+## [图表组件在项目中的应用参见 UReport数据报表](https://ext.dcloud.net.cn/plugin?id=4651) 
+- 秋云图表组件 修复APP端某些情况下报错`Not Found Page`的bug，fix by 高级bug开发技术员
+- 示例项目 修复APP端v-for循环某些情况下报错`Not Found Page`的bug，fix by 高级bug开发技术员
+- uCharts.js 修复非直角坐标系tooltip提示窗右侧超出未变换方向显示的bug
+## 2.0.0-20210415（2021-04-15）
+- 秋云图表组件 修复H5端发布到二级目录下echarts无法加载的bug
+- 秋云图表组件 修复某些情况下echarts.off('finished')移除监听事件报错的bug
+## 2.0.0-20210414（2021-04-14）
+## v1.0版本已停更，建议转uni_modules版本组件方式调用，点击右侧绿色【使用HBuilderX导入插件】即可使用，示例项目请点击右侧蓝色按钮【使用HBuilderX导入示例项目】。
+## 初次使用如果提示未注册&lt;qiun-data-charts&gt;组件，请重启HBuilderX，如仍不好用，请重启电脑；
+## 如果是cli项目，请尝试清理node_modules，重新install，还不行就删除项目，再重新install。
+## 此问题已于DCloud官方确认，HBuilderX下个版本会修复。
+## 其他图表不显示问题详见[常见问题选项卡](https://demo.ucharts.cn)
+## <font color=#FF0000> 新手请先完整阅读帮助文档及常见问题3遍，右侧蓝色按钮示例项目请看2遍！ </font> 
+## [DEMO演示及在线生成工具（v2.0文档）https://demo.ucharts.cn](https://demo.ucharts.cn)
+## [图表组件在项目中的应用参见 UReport数据报表](https://ext.dcloud.net.cn/plugin?id=4651) 
+- 秋云图表组件 修复H5端在cli项目下ECharts引用地址错误的bug
+- 示例项目 增加ECharts的formatter用法的示例(详见示例项目format-e.vue)
+- uCharts.js 增加圆环图中心背景色的配置extra.ring.centerColor
+- uCharts.js 修复微信小程序安卓端柱状图开启透明色后显示不正确的bug
+## 2.0.0-20210413（2021-04-13）
+- 秋云图表组件 修复百度小程序多个图表真机未能正确获取根元素dom尺寸的bug
+- 秋云图表组件 修复百度小程序横屏模式方向不正确的bug
+- 秋云图表组件 修改ontouch时，@getTouchStart@getTouchMove@getTouchEnd的触发条件
+- uCharts.js 修复饼图类数据格式series属性不生效的bug
+- uCharts.js 增加时序区域图 详见示例项目中ucharts.vue
+## 2.0.0-20210412-2（2021-04-12）
+## v1.0版本已停更，建议转uni_modules版本组件方式调用，点击右侧绿色【使用HBuilderX导入插件】即可使用，示例项目请点击右侧蓝色按钮【使用HBuilderX导入示例项目】。
+## 初次使用如果提示未注册&lt;qiun-data-charts&gt;组件，请重启HBuilderX。如仍不好用，请重启电脑，此问题已于DCloud官方确认，HBuilderX下个版本会修复。
+## [DEMO演示及在线生成工具（v2.0文档）https://demo.ucharts.cn](https://demo.ucharts.cn)
+## [图表组件在uniCloudAdmin中的应用 UReport数据报表](https://ext.dcloud.net.cn/plugin?id=4651) 
+- 秋云图表组件 修复uCharts在APP端横屏模式下不能正确渲染的bug
+- 示例项目 增加ECharts柱状图渐变色、圆角柱状图、横向柱状图（条状图）的示例
+## 2.0.0-20210412（2021-04-12）
+- 秋云图表组件 修复created中判断echarts导致APP端无法识别，改回mounted中判断echarts初始化
+- uCharts.js 修复2d模式下series.textOffset未乘像素比的bug
+## 2.0.0-20210411（2021-04-11）
+## v1.0版本已停更，建议转uni_modules版本组件方式调用，点击右侧绿色【使用HBuilderX导入插件】即可使用，示例项目请点击右侧蓝色按钮【使用HBuilderX导入示例项目】。
+## 初次使用如果提示未注册<qiun-data-charts>组件，请重启HBuilderX，并清空小程序开发者工具缓存。
+## [DEMO演示及在线生成工具（v2.0文档）https://demo.ucharts.cn](https://demo.ucharts.cn)
+## [图表组件在uniCloudAdmin中的应用 UReport数据报表](https://ext.dcloud.net.cn/plugin?id=4651) 
+- uCharts.js 折线图区域图增加connectNulls断点续连的功能，详见示例项目中ucharts.vue
+- 秋云图表组件 变更初始化方法为created，变更type2d默认值为true，优化2d模式下组件初始化后dom获取不到的bug
+- 秋云图表组件 修复左右布局时，右侧图表点击坐标错误的bug，修复tooltip柱状图自定义颜色显示object的bug
+## 2.0.0-20210410（2021-04-10）
+- 修复左右布局时，右侧图表点击坐标错误的bug，修复柱状图自定义颜色tooltip显示object的bug
+- 增加标记线及柱状图自定义颜色的demo
+## 2.0.0-20210409（2021-04-08）
+## v1.0版本已停更，建议转uni_modules版本组件方式调用，点击右侧【使用HBuilderX导入插件】即可体验，DEMO演示及在线生成工具（v2.0文档）[https://demo.ucharts.cn](https://demo.ucharts.cn)
+## 图表组件在uniCloudAdmin中的应用 [UReport数据报表](https://ext.dcloud.net.cn/plugin?id=4651) 
+- uCharts.js 修复钉钉小程序百度小程序measureText不准确的bug，修复2d模式下饼图类activeRadius为按比例放大的bug
+- 修复组件在支付宝小程序端点击位置不准确的bug
+## 2.0.0-20210408（2021-04-07）
+- 修复组件在支付宝小程序端不能显示的bug（目前支付宝小程不能点击交互，后续修复）
+- uCharts.js 修复高分屏下柱状图类，圆弧进度条 自定义宽度不能按比例放大的bug
+## 2.0.0-20210407（2021-04-06）
+## v1.0版本已停更，建议转uni_modules版本组件方式调用，点击右侧【使用HBuilderX导入插件】即可体验，DEMO演示及在线生成工具（v2.0文档）[https://demo.ucharts.cn](https://demo.ucharts.cn)
+## 增加 通过tofix和unit快速格式化y轴的demo add by `howcode`
+## 增加 图表组件在uniCloudAdmin中的应用 [UReport数据报表](https://ext.dcloud.net.cn/plugin?id=4651) 
+## 2.0.0-20210406（2021-04-05）
+# 秋云图表组件+uCharts v2.0版本同步上线，使用方法详见https://demo.ucharts.cn帮助页
+## 2.0.0（2021-04-05）
+# 秋云图表组件+uCharts v2.0版本同步上线，使用方法详见https://demo.ucharts.cn帮助页

uni_modules/qiun-data-charts/components/qiun-loading/loading1.vue

@@ -0,0 +1,162 @@
+<template>
+	 <view class="container loading1">
+		<view class="shape shape1"></view>
+		<view class="shape shape2"></view>
+		<view class="shape shape3"></view>
+		<view class="shape shape4"></view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'loading1',
+		data() {
+			return {
+				
+			};
+		}
+	}
+</script>
+
+<style scoped="true">
+.container {
+  width: 30px;
+  height: 30px;
+  position: relative;
+}
+.container.loading1 {
+  -webkit-transform: rotate(45deg);
+          transform: rotate(45deg);
+}
+
+.container .shape {
+  position: absolute;
+  width: 10px;
+  height: 10px;
+  border-radius: 1px;
+}
+.container .shape.shape1 {
+  left: 0;
+  background-color: #1890FF;
+}
+.container .shape.shape2 {
+  right: 0;
+  background-color: #91CB74;
+}
+.container .shape.shape3 {
+  bottom: 0;
+  background-color: #FAC858;
+}
+.container .shape.shape4 {
+  bottom: 0;
+  right: 0;
+  background-color: #EE6666;
+}
+
+.loading1 .shape1 {
+  -webkit-animation: animation1shape1 0.5s ease 0s infinite alternate;
+          animation: animation1shape1 0.5s ease 0s infinite alternate;
+}
+
+@-webkit-keyframes animation1shape1 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(16px, 16px);
+            transform: translate(16px, 16px);
+  }
+}
+
+@keyframes animation1shape1 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(16px, 16px);
+            transform: translate(16px, 16px);
+  }
+}
+.loading1 .shape2 {
+  -webkit-animation: animation1shape2 0.5s ease 0s infinite alternate;
+          animation: animation1shape2 0.5s ease 0s infinite alternate;
+}
+
+@-webkit-keyframes animation1shape2 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(-16px, 16px);
+            transform: translate(-16px, 16px);
+  }
+}
+
+@keyframes animation1shape2 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(-16px, 16px);
+            transform: translate(-16px, 16px);
+  }
+}
+.loading1 .shape3 {
+  -webkit-animation: animation1shape3 0.5s ease 0s infinite alternate;
+          animation: animation1shape3 0.5s ease 0s infinite alternate;
+}
+
+@-webkit-keyframes animation1shape3 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(16px, -16px);
+            transform: translate(16px, -16px);
+  }
+}
+
+@keyframes animation1shape3 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(16px, -16px);
+            transform: translate(16px, -16px);
+  }
+}
+.loading1 .shape4 {
+  -webkit-animation: animation1shape4 0.5s ease 0s infinite alternate;
+          animation: animation1shape4 0.5s ease 0s infinite alternate;
+}
+
+@-webkit-keyframes animation1shape4 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(-16px, -16px);
+            transform: translate(-16px, -16px);
+  }
+}
+
+@keyframes animation1shape4 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(-16px, -16px);
+            transform: translate(-16px, -16px);
+  }
+}
+
+
+</style>

uni_modules/qiun-data-charts/components/qiun-loading/loading2.vue

@@ -0,0 +1,170 @@
+<template>
+	 <view class="container loading2">
+		<view class="shape shape1"></view>
+		<view class="shape shape2"></view>
+		<view class="shape shape3"></view>
+		<view class="shape shape4"></view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'loading2',
+		data() {
+			return {
+				
+			};
+		}
+	}
+</script>
+
+<style scoped="true">
+.container {
+  width: 30px;
+  height: 30px;
+  position: relative;
+}
+
+.container.loading2 {
+  -webkit-transform: rotate(10deg);
+          transform: rotate(10deg);
+}
+.container.loading2 .shape {
+  border-radius: 5px;
+}
+.container.loading2{
+  -webkit-animation: rotation 1s infinite;
+          animation: rotation 1s infinite;
+}
+
+.container .shape {
+  position: absolute;
+  width: 10px;
+  height: 10px;
+  border-radius: 1px;
+}
+.container .shape.shape1 {
+  left: 0;
+  background-color: #1890FF;
+}
+.container .shape.shape2 {
+  right: 0;
+  background-color: #91CB74;
+}
+.container .shape.shape3 {
+  bottom: 0;
+  background-color: #FAC858;
+}
+.container .shape.shape4 {
+  bottom: 0;
+  right: 0;
+  background-color: #EE6666;
+}
+
+
+.loading2 .shape1 {
+  -webkit-animation: animation2shape1 0.5s ease 0s infinite alternate;
+          animation: animation2shape1 0.5s ease 0s infinite alternate;
+}
+
+@-webkit-keyframes animation2shape1 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(20px, 20px);
+            transform: translate(20px, 20px);
+  }
+}
+
+@keyframes animation2shape1 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(20px, 20px);
+            transform: translate(20px, 20px);
+  }
+}
+.loading2 .shape2 {
+  -webkit-animation: animation2shape2 0.5s ease 0s infinite alternate;
+          animation: animation2shape2 0.5s ease 0s infinite alternate;
+}
+
+@-webkit-keyframes animation2shape2 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(-20px, 20px);
+            transform: translate(-20px, 20px);
+  }
+}
+
+@keyframes animation2shape2 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(-20px, 20px);
+            transform: translate(-20px, 20px);
+  }
+}
+.loading2 .shape3 {
+  -webkit-animation: animation2shape3 0.5s ease 0s infinite alternate;
+          animation: animation2shape3 0.5s ease 0s infinite alternate;
+}
+
+@-webkit-keyframes animation2shape3 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(20px, -20px);
+            transform: translate(20px, -20px);
+  }
+}
+
+@keyframes animation2shape3 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(20px, -20px);
+            transform: translate(20px, -20px);
+  }
+}
+.loading2 .shape4 {
+  -webkit-animation: animation2shape4 0.5s ease 0s infinite alternate;
+          animation: animation2shape4 0.5s ease 0s infinite alternate;
+}
+
+@-webkit-keyframes animation2shape4 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(-20px, -20px);
+            transform: translate(-20px, -20px);
+  }
+}
+
+@keyframes animation2shape4 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(-20px, -20px);
+            transform: translate(-20px, -20px);
+  }
+}
+
+</style>

uni_modules/qiun-data-charts/components/qiun-loading/loading3.vue

@@ -0,0 +1,173 @@
+<template>
+	 <view class="container loading3">
+		<view class="shape shape1"></view>
+		<view class="shape shape2"></view>
+		<view class="shape shape3"></view>
+		<view class="shape shape4"></view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'loading3',
+		data() {
+			return {
+				
+			};
+		}
+	}
+</script>
+
+<style scoped="true">
+.container {
+  width: 30px;
+  height: 30px;
+  position: relative;
+}
+
+ .container.loading3 {
+  -webkit-animation: rotation 1s infinite;
+          animation: rotation 1s infinite;
+}
+.container.loading3 .shape1 {
+  border-top-left-radius: 10px;
+}
+.container.loading3 .shape2 {
+  border-top-right-radius: 10px;
+}
+.container.loading3 .shape3 {
+  border-bottom-left-radius: 10px;
+}
+.container.loading3 .shape4 {
+  border-bottom-right-radius: 10px;
+}
+
+.container .shape {
+  position: absolute;
+  width: 10px;
+  height: 10px;
+  border-radius: 1px;
+}
+.container .shape.shape1 {
+  left: 0;
+  background-color: #1890FF;
+}
+.container .shape.shape2 {
+  right: 0;
+  background-color: #91CB74;
+}
+.container .shape.shape3 {
+  bottom: 0;
+  background-color: #FAC858;
+}
+.container .shape.shape4 {
+  bottom: 0;
+  right: 0;
+  background-color: #EE6666;
+}
+
+.loading3 .shape1 {
+  -webkit-animation: animation3shape1 0.5s ease 0s infinite alternate;
+          animation: animation3shape1 0.5s ease 0s infinite alternate;
+}
+
+@-webkit-keyframes animation3shape1 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(5px, 5px);
+            transform: translate(5px, 5px);
+  }
+}
+
+@keyframes animation3shape1 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(5px, 5px);
+            transform: translate(5px, 5px);
+  }
+}
+.loading3 .shape2 {
+  -webkit-animation: animation3shape2 0.5s ease 0s infinite alternate;
+          animation: animation3shape2 0.5s ease 0s infinite alternate;
+}
+
+@-webkit-keyframes animation3shape2 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(-5px, 5px);
+            transform: translate(-5px, 5px);
+  }
+}
+
+@keyframes animation3shape2 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(-5px, 5px);
+            transform: translate(-5px, 5px);
+  }
+}
+.loading3 .shape3 {
+  -webkit-animation: animation3shape3 0.5s ease 0s infinite alternate;
+          animation: animation3shape3 0.5s ease 0s infinite alternate;
+}
+
+@-webkit-keyframes animation3shape3 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(5px, -5px);
+            transform: translate(5px, -5px);
+  }
+}
+
+@keyframes animation3shape3 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(5px, -5px);
+            transform: translate(5px, -5px);
+  }
+}
+.loading3 .shape4 {
+  -webkit-animation: animation3shape4 0.5s ease 0s infinite alternate;
+          animation: animation3shape4 0.5s ease 0s infinite alternate;
+}
+
+@-webkit-keyframes animation3shape4 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(-5px, -5px);
+            transform: translate(-5px, -5px);
+  }
+}
+
+@keyframes animation3shape4 {
+  from {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  to {
+    -webkit-transform: translate(-5px, -5px);
+            transform: translate(-5px, -5px);
+  }
+}
+</style>

uni_modules/qiun-data-charts/components/qiun-loading/loading4.vue

@@ -0,0 +1,222 @@
+<template>
+	 <view class="container loading5">
+		<view class="shape shape1"></view>
+		<view class="shape shape2"></view>
+		<view class="shape shape3"></view>
+		<view class="shape shape4"></view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'loading5',
+		data() {
+			return {
+				
+			};
+		}
+	}
+</script>
+
+<style scoped="true">
+.container {
+  width: 30px;
+  height: 30px;
+  position: relative;
+}
+
+.container.loading5 .shape {
+  width: 15px;
+  height: 15px;
+}
+
+.container .shape {
+  position: absolute;
+  width: 10px;
+  height: 10px;
+  border-radius: 1px;
+}
+.container .shape.shape1 {
+  left: 0;
+  background-color: #1890FF;
+}
+.container .shape.shape2 {
+  right: 0;
+  background-color: #91CB74;
+}
+.container .shape.shape3 {
+  bottom: 0;
+  background-color: #FAC858;
+}
+.container .shape.shape4 {
+  bottom: 0;
+  right: 0;
+  background-color: #EE6666;
+}
+
+.loading5 .shape1 {
+  animation: animation5shape1 2s ease 0s infinite reverse;
+}
+
+@-webkit-keyframes animation5shape1 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(0, 15px);
+            transform: translate(0, 15px);
+  }
+  50% {
+    -webkit-transform: translate(15px, 15px);
+            transform: translate(15px, 15px);
+  }
+  75% {
+    -webkit-transform: translate(15px, 0);
+            transform: translate(15px, 0);
+  }
+}
+
+@keyframes animation5shape1 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(0, 15px);
+            transform: translate(0, 15px);
+  }
+  50% {
+    -webkit-transform: translate(15px, 15px);
+            transform: translate(15px, 15px);
+  }
+  75% {
+    -webkit-transform: translate(15px, 0);
+            transform: translate(15px, 0);
+  }
+}
+.loading5 .shape2 {
+  animation: animation5shape2 2s ease 0s infinite reverse;
+}
+
+@-webkit-keyframes animation5shape2 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(-15px, 0);
+            transform: translate(-15px, 0);
+  }
+  50% {
+    -webkit-transform: translate(-15px, 15px);
+            transform: translate(-15px, 15px);
+  }
+  75% {
+    -webkit-transform: translate(0, 15px);
+            transform: translate(0, 15px);
+  }
+}
+
+@keyframes animation5shape2 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(-15px, 0);
+            transform: translate(-15px, 0);
+  }
+  50% {
+    -webkit-transform: translate(-15px, 15px);
+            transform: translate(-15px, 15px);
+  }
+  75% {
+    -webkit-transform: translate(0, 15px);
+            transform: translate(0, 15px);
+  }
+}
+.loading5 .shape3 {
+  animation: animation5shape3 2s ease 0s infinite reverse;
+}
+
+@-webkit-keyframes animation5shape3 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(15px, 0);
+            transform: translate(15px, 0);
+  }
+  50% {
+    -webkit-transform: translate(15px, -15px);
+            transform: translate(15px, -15px);
+  }
+  75% {
+    -webkit-transform: translate(0, -15px);
+            transform: translate(0, -15px);
+  }
+}
+
+@keyframes animation5shape3 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(15px, 0);
+            transform: translate(15px, 0);
+  }
+  50% {
+    -webkit-transform: translate(15px, -15px);
+            transform: translate(15px, -15px);
+  }
+  75% {
+    -webkit-transform: translate(0, -15px);
+            transform: translate(0, -15px);
+  }
+}
+.loading5 .shape4 {
+  animation: animation5shape4 2s ease 0s infinite reverse;
+}
+
+@-webkit-keyframes animation5shape4 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(0, -15px);
+            transform: translate(0, -15px);
+  }
+  50% {
+    -webkit-transform: translate(-15px, -15px);
+            transform: translate(-15px, -15px);
+  }
+  75% {
+    -webkit-transform: translate(-15px, 0);
+            transform: translate(-15px, 0);
+  }
+}
+
+@keyframes animation5shape4 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(0, -15px);
+            transform: translate(0, -15px);
+  }
+  50% {
+    -webkit-transform: translate(-15px, -15px);
+            transform: translate(-15px, -15px);
+  }
+  75% {
+    -webkit-transform: translate(-15px, 0);
+            transform: translate(-15px, 0);
+  }
+}
+
+</style>

uni_modules/qiun-data-charts/components/qiun-loading/loading5.vue

@@ -0,0 +1,229 @@
+<template>
+	 <view class="container loading6">
+		<view class="shape shape1"></view>
+		<view class="shape shape2"></view>
+		<view class="shape shape3"></view>
+		<view class="shape shape4"></view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'loading6',
+		data() {
+			return {
+				
+			};
+		}
+	}
+</script>
+<style scoped="true">
+.container {
+  width: 30px;
+  height: 30px;
+  position: relative;
+}
+
+.container.loading6 {
+  -webkit-animation: rotation 1s infinite;
+          animation: rotation 1s infinite;
+}
+.container.loading6 .shape {
+  width: 12px;
+  height: 12px;
+  border-radius: 2px;
+}
+.container .shape {
+  position: absolute;
+  width: 10px;
+  height: 10px;
+  border-radius: 1px;
+}
+.container .shape.shape1 {
+  left: 0;
+  background-color: #1890FF;
+}
+.container .shape.shape2 {
+  right: 0;
+  background-color: #91CB74;
+}
+.container .shape.shape3 {
+  bottom: 0;
+  background-color: #FAC858;
+}
+.container .shape.shape4 {
+  bottom: 0;
+  right: 0;
+  background-color: #EE6666;
+}
+
+
+.loading6 .shape1 {
+  -webkit-animation: animation6shape1 2s linear 0s infinite normal;
+          animation: animation6shape1 2s linear 0s infinite normal;
+}
+
+@-webkit-keyframes animation6shape1 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(0, 18px);
+            transform: translate(0, 18px);
+  }
+  50% {
+    -webkit-transform: translate(18px, 18px);
+            transform: translate(18px, 18px);
+  }
+  75% {
+    -webkit-transform: translate(18px, 0);
+            transform: translate(18px, 0);
+  }
+}
+
+@keyframes animation6shape1 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(0, 18px);
+            transform: translate(0, 18px);
+  }
+  50% {
+    -webkit-transform: translate(18px, 18px);
+            transform: translate(18px, 18px);
+  }
+  75% {
+    -webkit-transform: translate(18px, 0);
+            transform: translate(18px, 0);
+  }
+}
+.loading6 .shape2 {
+  -webkit-animation: animation6shape2 2s linear 0s infinite normal;
+          animation: animation6shape2 2s linear 0s infinite normal;
+}
+
+@-webkit-keyframes animation6shape2 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(-18px, 0);
+            transform: translate(-18px, 0);
+  }
+  50% {
+    -webkit-transform: translate(-18px, 18px);
+            transform: translate(-18px, 18px);
+  }
+  75% {
+    -webkit-transform: translate(0, 18px);
+            transform: translate(0, 18px);
+  }
+}
+
+@keyframes animation6shape2 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(-18px, 0);
+            transform: translate(-18px, 0);
+  }
+  50% {
+    -webkit-transform: translate(-18px, 18px);
+            transform: translate(-18px, 18px);
+  }
+  75% {
+    -webkit-transform: translate(0, 18px);
+            transform: translate(0, 18px);
+  }
+}
+.loading6 .shape3 {
+  -webkit-animation: animation6shape3 2s linear 0s infinite normal;
+          animation: animation6shape3 2s linear 0s infinite normal;
+}
+
+@-webkit-keyframes animation6shape3 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(18px, 0);
+            transform: translate(18px, 0);
+  }
+  50% {
+    -webkit-transform: translate(18px, -18px);
+            transform: translate(18px, -18px);
+  }
+  75% {
+    -webkit-transform: translate(0, -18px);
+            transform: translate(0, -18px);
+  }
+}
+
+@keyframes animation6shape3 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(18px, 0);
+            transform: translate(18px, 0);
+  }
+  50% {
+    -webkit-transform: translate(18px, -18px);
+            transform: translate(18px, -18px);
+  }
+  75% {
+    -webkit-transform: translate(0, -18px);
+            transform: translate(0, -18px);
+  }
+}
+.loading6 .shape4 {
+  -webkit-animation: animation6shape4 2s linear 0s infinite normal;
+          animation: animation6shape4 2s linear 0s infinite normal;
+}
+
+@-webkit-keyframes animation6shape4 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(0, -18px);
+            transform: translate(0, -18px);
+  }
+  50% {
+    -webkit-transform: translate(-18px, -18px);
+            transform: translate(-18px, -18px);
+  }
+  75% {
+    -webkit-transform: translate(-18px, 0);
+            transform: translate(-18px, 0);
+  }
+}
+
+@keyframes animation6shape4 {
+  0% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+  }
+  25% {
+    -webkit-transform: translate(0, -18px);
+            transform: translate(0, -18px);
+  }
+  50% {
+    -webkit-transform: translate(-18px, -18px);
+            transform: translate(-18px, -18px);
+  }
+  75% {
+    -webkit-transform: translate(-18px, 0);
+            transform: translate(-18px, 0);
+  }
+}
+</style>

uni_modules/qiun-data-charts/components/qiun-loading/qiun-loading.vue

@@ -0,0 +1,36 @@
+<template>
+	<view>
+	 <Loading1 v-if="loadingType==1"/>
+	 <Loading2 v-if="loadingType==2"/>
+	 <Loading3 v-if="loadingType==3"/>
+	 <Loading4 v-if="loadingType==4"/>
+	 <Loading5 v-if="loadingType==5"/>
+	</view>
+</template>
+
+<script>
+	import Loading1 from "./loading1.vue";
+	import Loading2 from "./loading2.vue";
+	import Loading3 from "./loading3.vue";
+	import Loading4 from "./loading4.vue";
+	import Loading5 from "./loading5.vue";
+	export default {
+		components:{Loading1,Loading2,Loading3,Loading4,Loading5},
+		name: 'qiun-loading',
+		props: {
+			loadingType: {
+				type: Number,
+				default: 2
+			},
+		},
+		data() {
+			return {
+				
+			};
+		},
+	}
+</script>
+
+<style>
+
+</style>