第一次提交
D
3 years ago
commit
e1f6e93503
@ -0,0 +1,4 @@
|
||||
.hbuilderx
|
||||
unpackage
|
||||
dist
|
||||
node_modules
|
||||
@ -0,0 +1,21 @@
|
||||
MIT License
|
||||
|
||||
Copyright (c) 2023 哦NO
|
||||
|
||||
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.
|
||||
@ -0,0 +1,20 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<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>
|
||||
<title></title>
|
||||
<!--preload-links-->
|
||||
<!--app-context-->
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"><!--app-html--></div>
|
||||
<script type="module" src="/main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@ -0,0 +1,78 @@
|
||||
{
|
||||
"name": "uni-preset-vue",
|
||||
"version": "0.0.0",
|
||||
"scripts": {
|
||||
"dev:app": "uni -p app",
|
||||
"dev:app-android": "uni -p app-android",
|
||||
"dev:app-ios": "uni -p app-ios",
|
||||
"dev:custom": "uni -p",
|
||||
"dev:h5": "uni",
|
||||
"dev:h5:ssr": "uni --ssr",
|
||||
"dev:mp-alipay": "uni -p mp-alipay",
|
||||
"dev:mp-baidu": "uni -p mp-baidu",
|
||||
"dev:mp-jd": "uni -p mp-jd",
|
||||
"dev:mp-kuaishou": "uni -p mp-kuaishou",
|
||||
"dev:mp-lark": "uni -p mp-lark",
|
||||
"dev:mp-qq": "uni -p mp-qq",
|
||||
"dev:mp-toutiao": "uni -p mp-toutiao",
|
||||
"dev:mp-weixin": "uni -p mp-weixin",
|
||||
"dev:quickapp-webview": "uni -p quickapp-webview",
|
||||
"dev:quickapp-webview-huawei": "uni -p quickapp-webview-huawei",
|
||||
"dev:quickapp-webview-union": "uni -p quickapp-webview-union",
|
||||
"build:app": "uni build -p app",
|
||||
"build:app-android": "uni build -p app-android",
|
||||
"build:app-ios": "uni build -p app-ios",
|
||||
"build:custom": "uni build -p",
|
||||
"build:h5": "uni build",
|
||||
"build:h5:ssr": "uni build --ssr",
|
||||
"build:mp-alipay": "uni build -p mp-alipay",
|
||||
"build:mp-baidu": "uni build -p mp-baidu",
|
||||
"build:mp-jd": "uni build -p mp-jd",
|
||||
"build:mp-kuaishou": "uni build -p mp-kuaishou",
|
||||
"build:mp-lark": "uni build -p mp-lark",
|
||||
"build:mp-qq": "uni build -p mp-qq",
|
||||
"build:mp-toutiao": "uni build -p mp-toutiao",
|
||||
"build:mp-weixin": "uni build -p mp-weixin",
|
||||
"build:quickapp-webview": "uni build -p quickapp-webview",
|
||||
"build:quickapp-webview-huawei": "uni build -p quickapp-webview-huawei",
|
||||
"build:quickapp-webview-union": "uni build -p quickapp-webview-union",
|
||||
"type-check": "vue-tsc --noEmit"
|
||||
},
|
||||
"dependencies": {
|
||||
"@dcloudio/uni-app": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-app-plus": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-components": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-h5": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-mp-alipay": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-mp-baidu": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-mp-jd": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-mp-kuaishou": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-mp-lark": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-mp-qq": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-mp-toutiao": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-mp-weixin": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-quickapp-webview": "3.0.0-3080720230703001",
|
||||
"@qiun/wx-ucharts": "2.5.0-20230101",
|
||||
"@ttou/uview-typings": "^2.0.5",
|
||||
"clipboard": "^2.0.11",
|
||||
"dayjs": "^1.11.9",
|
||||
"uview-plus": "^3.1.36",
|
||||
"vue": "^3.2.45",
|
||||
"vue-i18n": "^9.1.9",
|
||||
"vuex": "^4.1.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@dcloudio/types": "^3.3.2",
|
||||
"@dcloudio/uni-automator": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-cli-shared": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-stacktracey": "3.0.0-3080720230703001",
|
||||
"@dcloudio/vite-plugin-uni": "3.0.0-3080720230703001",
|
||||
"@vue/tsconfig": "^0.1.3",
|
||||
"less": "^4.2.0",
|
||||
"sass": "^1.64.2",
|
||||
"sass-loader": "10",
|
||||
"typescript": "^4.9.4",
|
||||
"vite": "4.0.4",
|
||||
"vue-tsc": "^1.0.24"
|
||||
}
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,18 @@
|
||||
<script>
|
||||
export default {
|
||||
onLaunch: function () {
|
||||
console.log('App Launch')
|
||||
},
|
||||
onShow: function () {
|
||||
console.log('App Show')
|
||||
},
|
||||
onHide: function () {
|
||||
console.log('App Hide')
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import "uview-plus/index.scss";
|
||||
@import '@/static/scss/index.scss';
|
||||
</style>
|
||||
@ -0,0 +1,59 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
// 登录方法
|
||||
export function login(username, password, code, uuid) {
|
||||
const data = {
|
||||
username,
|
||||
password,
|
||||
code,
|
||||
uuid
|
||||
}
|
||||
return request({
|
||||
url: '/login',
|
||||
headers: {
|
||||
isToken: false
|
||||
},
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 注册方法
|
||||
export function register(data) {
|
||||
return request({
|
||||
url: '/register',
|
||||
headers: {
|
||||
isToken: false
|
||||
},
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 获取用户详细信息
|
||||
export function getInfo() {
|
||||
return request({
|
||||
url: '/getInfo',
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
// 退出方法
|
||||
export function logout() {
|
||||
return request({
|
||||
url: '/logout',
|
||||
method: 'post'
|
||||
})
|
||||
}
|
||||
|
||||
// 获取验证码
|
||||
export function getCodeImg() {
|
||||
return request({
|
||||
url: '/captchaImage',
|
||||
headers: {
|
||||
isToken: false
|
||||
},
|
||||
method: 'get',
|
||||
timeout: 20000
|
||||
})
|
||||
}
|
||||
@ -0,0 +1,41 @@
|
||||
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/updatePwd',
|
||||
method: 'put',
|
||||
params: data
|
||||
})
|
||||
}
|
||||
|
||||
// 查询用户个人信息
|
||||
export function getUserProfile() {
|
||||
return request({
|
||||
url: '/system/user/profile',
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
// 修改用户个人信息
|
||||
export function updateUserProfile(data) {
|
||||
return request({
|
||||
url: '/system/user/profile',
|
||||
method: 'put',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 用户头像上传
|
||||
export function uploadAvatar(data) {
|
||||
return upload({
|
||||
url: '/system/user/profile/avatar',
|
||||
name: data.name,
|
||||
filePath: data.filePath
|
||||
})
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
@ -0,0 +1,201 @@
|
||||
Apache License
|
||||
Version 2.0, January 2004
|
||||
http://www.apache.org/licenses/
|
||||
|
||||
TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
|
||||
|
||||
1. Definitions.
|
||||
|
||||
"License" shall mean the terms and conditions for use, reproduction,
|
||||
and distribution as defined by Sections 1 through 9 of this document.
|
||||
|
||||
"Licensor" shall mean the copyright owner or entity authorized by
|
||||
the copyright owner that is granting the License.
|
||||
|
||||
"Legal Entity" shall mean the union of the acting entity and all
|
||||
other entities that control, are controlled by, or are under common
|
||||
control with that entity. For the purposes of this definition,
|
||||
"control" means (i) the power, direct or indirect, to cause the
|
||||
direction or management of such entity, whether by contract or
|
||||
otherwise, or (ii) ownership of fifty percent (50%) or more of the
|
||||
outstanding shares, or (iii) beneficial ownership of such entity.
|
||||
|
||||
"You" (or "Your") shall mean an individual or Legal Entity
|
||||
exercising permissions granted by this License.
|
||||
|
||||
"Source" form shall mean the preferred form for making modifications,
|
||||
including but not limited to software source code, documentation
|
||||
source, and configuration files.
|
||||
|
||||
"Object" form shall mean any form resulting from mechanical
|
||||
transformation or translation of a Source form, including but
|
||||
not limited to compiled object code, generated documentation,
|
||||
and conversions to other media types.
|
||||
|
||||
"Work" shall mean the work of authorship, whether in Source or
|
||||
Object form, made available under the License, as indicated by a
|
||||
copyright notice that is included in or attached to the work
|
||||
(an example is provided in the Appendix below).
|
||||
|
||||
"Derivative Works" shall mean any work, whether in Source or Object
|
||||
form, that is based on (or derived from) the Work and for which the
|
||||
editorial revisions, annotations, elaborations, or other modifications
|
||||
represent, as a whole, an original work of authorship. For the purposes
|
||||
of this License, Derivative Works shall not include works that remain
|
||||
separable from, or merely link (or bind by name) to the interfaces of,
|
||||
the Work and Derivative Works thereof.
|
||||
|
||||
"Contribution" shall mean any work of authorship, including
|
||||
the original version of the Work and any modifications or additions
|
||||
to that Work or Derivative Works thereof, that is intentionally
|
||||
submitted to Licensor for inclusion in the Work by the copyright owner
|
||||
or by an individual or Legal Entity authorized to submit on behalf of
|
||||
the copyright owner. For the purposes of this definition, "submitted"
|
||||
means any form of electronic, verbal, or written communication sent
|
||||
to the Licensor or its representatives, including but not limited to
|
||||
communication on electronic mailing lists, source code control systems,
|
||||
and issue tracking systems that are managed by, or on behalf of, the
|
||||
Licensor for the purpose of discussing and improving the Work, but
|
||||
excluding communication that is conspicuously marked or otherwise
|
||||
designated in writing by the copyright owner as "Not a Contribution."
|
||||
|
||||
"Contributor" shall mean Licensor and any individual or Legal Entity
|
||||
on behalf of whom a Contribution has been received by Licensor and
|
||||
subsequently incorporated within the Work.
|
||||
|
||||
2. Grant of Copyright License. Subject to the terms and conditions of
|
||||
this License, each Contributor hereby grants to You a perpetual,
|
||||
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
|
||||
copyright license to reproduce, prepare Derivative Works of,
|
||||
publicly display, publicly perform, sublicense, and distribute the
|
||||
Work and such Derivative Works in Source or Object form.
|
||||
|
||||
3. Grant of Patent License. Subject to the terms and conditions of
|
||||
this License, each Contributor hereby grants to You a perpetual,
|
||||
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
|
||||
(except as stated in this section) patent license to make, have made,
|
||||
use, offer to sell, sell, import, and otherwise transfer the Work,
|
||||
where such license applies only to those patent claims licensable
|
||||
by such Contributor that are necessarily infringed by their
|
||||
Contribution(s) alone or by combination of their Contribution(s)
|
||||
with the Work to which such Contribution(s) was submitted. If You
|
||||
institute patent litigation against any entity (including a
|
||||
cross-claim or counterclaim in a lawsuit) alleging that the Work
|
||||
or a Contribution incorporated within the Work constitutes direct
|
||||
or contributory patent infringement, then any patent licenses
|
||||
granted to You under this License for that Work shall terminate
|
||||
as of the date such litigation is filed.
|
||||
|
||||
4. Redistribution. You may reproduce and distribute copies of the
|
||||
Work or Derivative Works thereof in any medium, with or without
|
||||
modifications, and in Source or Object form, provided that You
|
||||
meet the following conditions:
|
||||
|
||||
(a) You must give any other recipients of the Work or
|
||||
Derivative Works a copy of this License; and
|
||||
|
||||
(b) You must cause any modified files to carry prominent notices
|
||||
stating that You changed the files; and
|
||||
|
||||
(c) You must retain, in the Source form of any Derivative Works
|
||||
that You distribute, all copyright, patent, trademark, and
|
||||
attribution notices from the Source form of the Work,
|
||||
excluding those notices that do not pertain to any part of
|
||||
the Derivative Works; and
|
||||
|
||||
(d) If the Work includes a "NOTICE" text file as part of its
|
||||
distribution, then any Derivative Works that You distribute must
|
||||
include a readable copy of the attribution notices contained
|
||||
within such NOTICE file, excluding those notices that do not
|
||||
pertain to any part of the Derivative Works, in at least one
|
||||
of the following places: within a NOTICE text file distributed
|
||||
as part of the Derivative Works; within the Source form or
|
||||
documentation, if provided along with the Derivative Works; or,
|
||||
within a display generated by the Derivative Works, if and
|
||||
wherever such third-party notices normally appear. The contents
|
||||
of the NOTICE file are for informational purposes only and
|
||||
do not modify the License. You may add Your own attribution
|
||||
notices within Derivative Works that You distribute, alongside
|
||||
or as an addendum to the NOTICE text from the Work, provided
|
||||
that such additional attribution notices cannot be construed
|
||||
as modifying the License.
|
||||
|
||||
You may add Your own copyright statement to Your modifications and
|
||||
may provide additional or different license terms and conditions
|
||||
for use, reproduction, or distribution of Your modifications, or
|
||||
for any such Derivative Works as a whole, provided Your use,
|
||||
reproduction, and distribution of the Work otherwise complies with
|
||||
the conditions stated in this License.
|
||||
|
||||
5. Submission of Contributions. Unless You explicitly state otherwise,
|
||||
any Contribution intentionally submitted for inclusion in the Work
|
||||
by You to the Licensor shall be under the terms and conditions of
|
||||
this License, without any additional terms or conditions.
|
||||
Notwithstanding the above, nothing herein shall supersede or modify
|
||||
the terms of any separate license agreement you may have executed
|
||||
with Licensor regarding such Contributions.
|
||||
|
||||
6. Trademarks. This License does not grant permission to use the trade
|
||||
names, trademarks, service marks, or product names of the Licensor,
|
||||
except as required for reasonable and customary use in describing the
|
||||
origin of the Work and reproducing the content of the NOTICE file.
|
||||
|
||||
7. Disclaimer of Warranty. Unless required by applicable law or
|
||||
agreed to in writing, Licensor provides the Work (and each
|
||||
Contributor provides its Contributions) on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
|
||||
implied, including, without limitation, any warranties or conditions
|
||||
of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
|
||||
PARTICULAR PURPOSE. You are solely responsible for determining the
|
||||
appropriateness of using or redistributing the Work and assume any
|
||||
risks associated with Your exercise of permissions under this License.
|
||||
|
||||
8. Limitation of Liability. In no event and under no legal theory,
|
||||
whether in tort (including negligence), contract, or otherwise,
|
||||
unless required by applicable law (such as deliberate and grossly
|
||||
negligent acts) or agreed to in writing, shall any Contributor be
|
||||
liable to You for damages, including any direct, indirect, special,
|
||||
incidental, or consequential damages of any character arising as a
|
||||
result of this License or out of the use or inability to use the
|
||||
Work (including but not limited to damages for loss of goodwill,
|
||||
work stoppage, computer failure or malfunction, or any and all
|
||||
other commercial damages or losses), even if such Contributor
|
||||
has been advised of the possibility of such damages.
|
||||
|
||||
9. Accepting Warranty or Additional Liability. While redistributing
|
||||
the Work or Derivative Works thereof, You may choose to offer,
|
||||
and charge a fee for, acceptance of support, warranty, indemnity,
|
||||
or other liability obligations and/or rights consistent with this
|
||||
License. However, in accepting such obligations, You may act only
|
||||
on Your own behalf and on Your sole responsibility, not on behalf
|
||||
of any other Contributor, and only if You agree to indemnify,
|
||||
defend, and hold each Contributor harmless for any liability
|
||||
incurred by, or claims asserted against, such Contributor by reason
|
||||
of your accepting any such warranty or additional liability.
|
||||
|
||||
END OF TERMS AND CONDITIONS
|
||||
|
||||
APPENDIX: How to apply the Apache License to your work.
|
||||
|
||||
To apply the Apache License to your work, attach the following
|
||||
boilerplate notice, with the fields enclosed by brackets "[]"
|
||||
replaced with your own identifying information. (Don't include
|
||||
the brackets!) The text should be enclosed in the appropriate
|
||||
comment syntax for the file format. We also recommend that a
|
||||
file or class name and description of purpose be included on the
|
||||
same "printed page" as the copyright notice for easier
|
||||
identification within third-party archives.
|
||||
|
||||
Copyright [yyyy] [name of copyright owner]
|
||||
|
||||
Licensed under the Apache License, Version 2.0 (the "License");
|
||||
you may not use this file except in compliance with the License.
|
||||
You may obtain a copy of the License at
|
||||
|
||||
http://www.apache.org/licenses/LICENSE-2.0
|
||||
|
||||
Unless required by applicable law or agreed to in writing, software
|
||||
distributed under the License is distributed on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -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>
|
||||
@ -0,0 +1,29 @@
|
||||
// 应用全局配置
|
||||
const config = {
|
||||
baseUrl: 'https://vue.ruoyi.vip/prod-api',
|
||||
//cloud后台网关地址
|
||||
// baseUrl: 'http://192.168.10.3:8080',
|
||||
// 应用信息
|
||||
appInfo: {
|
||||
// 应用名称
|
||||
name: "ruoyi-app-vue3",
|
||||
// 应用版本
|
||||
version: "1.1.0",
|
||||
// 应用logo
|
||||
logo: "/static/logo.png",
|
||||
// 官方网站
|
||||
site_url: "http://ruoyi.vip",
|
||||
// 政策协议
|
||||
agreements: [{
|
||||
title: "隐私政策",
|
||||
url: "https://ruoyi.vip/protocol.html"
|
||||
},
|
||||
{
|
||||
title: "用户服务协议",
|
||||
url: "https://ruoyi.vip/protocol.html"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
|
||||
export default config
|
||||
@ -0,0 +1,9 @@
|
||||
/// <reference types="vite/client" />
|
||||
|
||||
declare module '*.vue' {
|
||||
import { DefineComponent } from 'vue'
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
|
||||
const component: DefineComponent<{}, {}, any>
|
||||
export default component
|
||||
}
|
||||
declare module "uview-plus";
|
||||
@ -0,0 +1,14 @@
|
||||
import App from './App.vue'
|
||||
import plugins from './plugins'
|
||||
import uviewPlus from 'uview-plus'
|
||||
|
||||
|
||||
import { createSSRApp } from 'vue'
|
||||
export function createApp() {
|
||||
const app = createSSRApp(App)
|
||||
app.use(uviewPlus)
|
||||
app.use(plugins)
|
||||
return {
|
||||
app
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,72 @@
|
||||
{
|
||||
"name" : "ruoyi-vue3",
|
||||
"appid" : "__UNI__3DD118D",
|
||||
"description" : "",
|
||||
"versionName" : "1.0.0",
|
||||
"versionCode" : "100",
|
||||
"transformPx" : false,
|
||||
/* 5+App特有相关 */
|
||||
"app-plus" : {
|
||||
"usingComponents" : true,
|
||||
"nvueStyleCompiler" : "uni-app",
|
||||
"compilerVersion" : 3,
|
||||
"splashscreen" : {
|
||||
"alwaysShowBeforeRender" : true,
|
||||
"waiting" : true,
|
||||
"autoclose" : true,
|
||||
"delay" : 0
|
||||
},
|
||||
/* 模块配置 */
|
||||
"modules" : {},
|
||||
/* 应用发布信息 */
|
||||
"distribute" : {
|
||||
/* android打包配置 */
|
||||
"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打包配置 */
|
||||
"ios" : {},
|
||||
/* SDK配置 */
|
||||
"sdkConfigs" : {}
|
||||
}
|
||||
},
|
||||
/* 快应用特有相关 */
|
||||
"quickapp" : {},
|
||||
/* 小程序特有相关 */
|
||||
"mp-weixin" : {
|
||||
"appid" : "",
|
||||
"setting" : {
|
||||
"urlCheck" : false
|
||||
},
|
||||
"usingComponents" : true
|
||||
},
|
||||
"mp-alipay" : {
|
||||
"usingComponents" : true
|
||||
},
|
||||
"mp-baidu" : {
|
||||
"usingComponents" : true
|
||||
},
|
||||
"mp-toutiao" : {
|
||||
"usingComponents" : true
|
||||
},
|
||||
"uniStatistics" : {
|
||||
"enable" : false
|
||||
},
|
||||
"vueVersion" : "3"
|
||||
}
|
||||
@ -0,0 +1,75 @@
|
||||
{
|
||||
"name": "uni-preset-vue",
|
||||
"version": "0.0.0",
|
||||
"scripts": {
|
||||
"dev:app": "uni -p app",
|
||||
"dev:app-android": "uni -p app-android",
|
||||
"dev:app-ios": "uni -p app-ios",
|
||||
"dev:custom": "uni -p",
|
||||
"dev:h5": "uni",
|
||||
"dev:h5:ssr": "uni --ssr",
|
||||
"dev:mp-alipay": "uni -p mp-alipay",
|
||||
"dev:mp-baidu": "uni -p mp-baidu",
|
||||
"dev:mp-jd": "uni -p mp-jd",
|
||||
"dev:mp-kuaishou": "uni -p mp-kuaishou",
|
||||
"dev:mp-lark": "uni -p mp-lark",
|
||||
"dev:mp-qq": "uni -p mp-qq",
|
||||
"dev:mp-toutiao": "uni -p mp-toutiao",
|
||||
"dev:mp-weixin": "uni -p mp-weixin",
|
||||
"dev:quickapp-webview": "uni -p quickapp-webview",
|
||||
"dev:quickapp-webview-huawei": "uni -p quickapp-webview-huawei",
|
||||
"dev:quickapp-webview-union": "uni -p quickapp-webview-union",
|
||||
"build:app": "uni build -p app",
|
||||
"build:app-android": "uni build -p app-android",
|
||||
"build:app-ios": "uni build -p app-ios",
|
||||
"build:custom": "uni build -p",
|
||||
"build:h5": "uni build",
|
||||
"build:h5:ssr": "uni build --ssr",
|
||||
"build:mp-alipay": "uni build -p mp-alipay",
|
||||
"build:mp-baidu": "uni build -p mp-baidu",
|
||||
"build:mp-jd": "uni build -p mp-jd",
|
||||
"build:mp-kuaishou": "uni build -p mp-kuaishou",
|
||||
"build:mp-lark": "uni build -p mp-lark",
|
||||
"build:mp-qq": "uni build -p mp-qq",
|
||||
"build:mp-toutiao": "uni build -p mp-toutiao",
|
||||
"build:mp-weixin": "uni build -p mp-weixin",
|
||||
"build:quickapp-webview": "uni build -p quickapp-webview",
|
||||
"build:quickapp-webview-huawei": "uni build -p quickapp-webview-huawei",
|
||||
"build:quickapp-webview-union": "uni build -p quickapp-webview-union",
|
||||
"type-check": "vue-tsc --noEmit"
|
||||
},
|
||||
"dependencies": {
|
||||
"@dcloudio/uni-app": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-app-plus": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-components": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-h5": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-mp-alipay": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-mp-baidu": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-mp-jd": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-mp-kuaishou": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-mp-lark": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-mp-qq": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-mp-toutiao": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-mp-weixin": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-quickapp-webview": "3.0.0-3080720230703001",
|
||||
"@ttou/uview-typings": "^2.0.5",
|
||||
"clipboard": "^2.0.11",
|
||||
"dayjs": "^1.11.9",
|
||||
"uview-plus": "^3.1.36",
|
||||
"vue": "^3.2.45",
|
||||
"vue-i18n": "^9.1.9"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@dcloudio/types": "^3.3.2",
|
||||
"@dcloudio/uni-automator": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-cli-shared": "3.0.0-3080720230703001",
|
||||
"@dcloudio/uni-stacktracey": "3.0.0-3080720230703001",
|
||||
"@dcloudio/vite-plugin-uni": "3.0.0-3080720230703001",
|
||||
"@vue/tsconfig": "^0.1.3",
|
||||
"sass": "^1.64.2",
|
||||
"sass-loader": "10",
|
||||
"typescript": "^4.9.4",
|
||||
"vite": "4.0.4",
|
||||
"vue-tsc": "^1.0.24"
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,266 @@
|
||||
{
|
||||
"easycom": {
|
||||
"custom": {
|
||||
"^u--(.*)": "uview-plus/components/u-$1/u-$1.vue",
|
||||
"^up-(.*)": "uview-plus/components/u-$1/u-$1.vue",
|
||||
"^u-([^-].*)": "uview-plus/components/u-$1/u-$1.vue",
|
||||
"qiun-(.*)": "@/components/qiun-data-charts/components/qiun-$1/qiun-$1.vue"
|
||||
}
|
||||
},
|
||||
"pages": [
|
||||
{
|
||||
"path": "pages/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "若依移动端框架",
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/login",
|
||||
"style": {
|
||||
"navigationBarTitleText": "登录"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/work",
|
||||
"style": {
|
||||
"navigationBarTitleText": "工作台"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/template",
|
||||
"style": {
|
||||
"navigationBarTitleText": "模板"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/mine",
|
||||
"style": {
|
||||
"navigationBarTitleText": "我的"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/common/webview/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "浏览网页"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/common/textview/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "浏览文本"
|
||||
}
|
||||
}
|
||||
],
|
||||
"subPackages": [
|
||||
{
|
||||
"root": "pages_mine/pages",
|
||||
"pages": [
|
||||
{
|
||||
"path": "avatar/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "修改头像"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "info/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "个人信息"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "info/edit",
|
||||
"style": {
|
||||
"navigationBarTitleText": "编辑资料"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pwd/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "修改密码"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "setting/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "应用设置"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "help/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "常见问题"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "about/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "关于我们"
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"root": "pages_template/pages",
|
||||
"pages": [
|
||||
{
|
||||
"path": "wxCenter/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "wxCenter 仿微信个人中心",
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "keyboardPay/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "keyboardPay 自定义键盘支付"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "mallMenu/index2",
|
||||
"style": {
|
||||
"navigationBarTitleText": "mallMenu-商城分类"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "mallMenu/index1",
|
||||
"style": {
|
||||
"navigationBarTitleText": "mallMenu-商城分类"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "coupon/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "coupon-优惠券"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "login/index1",
|
||||
"style": {
|
||||
"navigationBarTitleText": "美团登录"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "login/index2",
|
||||
"style": {
|
||||
"navigationBarTitleText": "水滴登录"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "citySelect/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "城市选择"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "submitBar/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "提交订单栏"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "comment/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "评论"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "comment/reply",
|
||||
"style": {
|
||||
"navigationBarTitleText": "评论详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "order/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "订单"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "login/code",
|
||||
"style": {
|
||||
"navigationBarTitleText": "登录获取验证码"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "address/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "用户地址"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "address/addSite",
|
||||
"style": {
|
||||
"navigationBarTitleText": "添加用户地址"
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"root": "pages_qiun/pages",
|
||||
"pages": [
|
||||
{
|
||||
"path": "sport/index",
|
||||
"style": {
|
||||
"pageOrientation": "auto"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "school/index",
|
||||
"style": {
|
||||
"pageOrientation": "auto"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "finance/index",
|
||||
"style": {
|
||||
"pageOrientation": "auto"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "main/index",
|
||||
"style": {
|
||||
"pageOrientation": "auto"
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"tabBar": {
|
||||
"color": "#000000",
|
||||
"selectedColor": "#000000",
|
||||
"borderStyle": "white",
|
||||
"backgroundColor": "#ffffff",
|
||||
"list": [
|
||||
{
|
||||
"pagePath": "pages/index",
|
||||
"iconPath": "static/images/tabbar/home.png",
|
||||
"selectedIconPath": "static/images/tabbar/home_.png",
|
||||
"text": "首页"
|
||||
},
|
||||
{
|
||||
"pagePath": "pages/work",
|
||||
"iconPath": "static/images/tabbar/work.png",
|
||||
"selectedIconPath": "static/images/tabbar/work_.png",
|
||||
"text": "工作台"
|
||||
},
|
||||
{
|
||||
"pagePath": "pages/template",
|
||||
"iconPath": "static/images/tabbar/work.png",
|
||||
"selectedIconPath": "static/images/tabbar/work_.png",
|
||||
"text": "模板"
|
||||
},
|
||||
{
|
||||
"pagePath": "pages/mine",
|
||||
"iconPath": "static/images/tabbar/mine.png",
|
||||
"selectedIconPath": "static/images/tabbar/mine_.png",
|
||||
"text": "我的"
|
||||
}
|
||||
]
|
||||
},
|
||||
"globalStyle": {
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarTitleText": "RuoYi",
|
||||
"navigationBarBackgroundColor": "#FFFFFF"
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,43 @@
|
||||
<template>
|
||||
<view>
|
||||
<uni-card class="view-title" :title="title">
|
||||
<text class="uni-body view-content">{{ content }}</text>
|
||||
</uni-card>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
title: '',
|
||||
content: ''
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
this.title = options.title
|
||||
this.content = options.content
|
||||
uni.setNavigationBarTitle({
|
||||
title: options.title
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
page {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.view-title {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.view-content {
|
||||
font-size: 26rpx;
|
||||
padding: 12px 5px 0;
|
||||
color: #333;
|
||||
line-height: 24px;
|
||||
font-weight: normal;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,34 @@
|
||||
<template>
|
||||
<view v-if="params.url">
|
||||
<web-view :webview-styles="webviewStyles" :src="`${params.url}`"></web-view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
params: {},
|
||||
webviewStyles: {
|
||||
progress: {
|
||||
color: "#FF3333"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
props: {
|
||||
src: {
|
||||
type: [String],
|
||||
default: null
|
||||
}
|
||||
},
|
||||
onLoad(event) {
|
||||
this.params = event
|
||||
if (event.title) {
|
||||
uni.setNavigationBarTitle({
|
||||
title: event.title
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -0,0 +1,81 @@
|
||||
<template>
|
||||
<view class="content">
|
||||
<image class="logo" src="@/static/logo.png"></image>
|
||||
<view class="text-area">
|
||||
<text class="title">Hello RuoYi-Vue</text>
|
||||
</view>
|
||||
<view class="text-area">
|
||||
<up-text type="primary" text="uview-plus"></up-text>
|
||||
</view>
|
||||
<view class="charts-box">
|
||||
<qiun-data-charts type="column" :chartData="chartData" />
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
chartData: {},
|
||||
};
|
||||
},
|
||||
onReady() {
|
||||
this.getServerData();
|
||||
},
|
||||
methods: {
|
||||
getServerData() {
|
||||
//模拟从服务器获取数据时的延时
|
||||
setTimeout(() => {
|
||||
let res = {
|
||||
categories: ["2016", "2017", "2018", "2019", "2020", "2021"],
|
||||
series: [
|
||||
{
|
||||
name: "目标值",
|
||||
data: [35, 36, 31, 33, 13, 34]
|
||||
},
|
||||
{
|
||||
name: "完成量",
|
||||
data: [18, 27, 21, 24, 6, 28]
|
||||
}
|
||||
]
|
||||
};
|
||||
this.chartData = JSON.parse(JSON.stringify(res));
|
||||
}, 500);
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.logo {
|
||||
height: 200rpx;
|
||||
width: 200rpx;
|
||||
margin-top: 200rpx;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-bottom: 50rpx;
|
||||
}
|
||||
|
||||
.text-area {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 36rpx;
|
||||
color: #8f8f94;
|
||||
}
|
||||
|
||||
.charts-box {
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,191 @@
|
||||
<template>
|
||||
<view class="normal-login-container">
|
||||
<view class="logo-content align-center justify-center flex">
|
||||
<image style="width: 100rpx;height: 100rpx;" :src="globalConfig.appInfo.logo" mode="widthFix">
|
||||
</image>
|
||||
<text class="title">若依移动端登录</text>
|
||||
</view>
|
||||
<view class="login-form-content">
|
||||
<view class="input-item flex align-center">
|
||||
<view class="iconfont icon-user icon"></view>
|
||||
<input v-model="loginForm.username" class="input" type="text" placeholder="请输入账号" maxlength="30" />
|
||||
</view>
|
||||
<view class="input-item flex align-center">
|
||||
<view class="iconfont icon-password icon"></view>
|
||||
<input v-model="loginForm.password" type="password" class="input" placeholder="请输入密码" maxlength="20" />
|
||||
</view>
|
||||
<view class="input-item flex align-center" style="width: 60%;margin: 0px;" v-if="captchaEnabled">
|
||||
<view class="iconfont icon-code icon"></view>
|
||||
<input v-model="loginForm.code" type="number" class="input" placeholder="请输入验证码" maxlength="4" />
|
||||
<view class="login-code">
|
||||
<image :src="codeUrl" @click="getCode" class="login-code-img"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="action-btn">
|
||||
<button @click="handleLogin" class="login-btn cu-btn block bg-blue lg round">登录</button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="xieyi text-center">
|
||||
<text class="text-grey1">登录即代表同意</text>
|
||||
<text @click="handleUserAgrement" class="text-blue">《用户协议》</text>
|
||||
<text @click="handlePrivacy" class="text-blue">《隐私协议》</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import modal from '@/plugins/modal'
|
||||
import { getCodeImg } from '@/api/login'
|
||||
import { ref } from "vue";
|
||||
import config from '@/config.js'
|
||||
import store from '@/store'
|
||||
const codeUrl = ref("");
|
||||
const captchaEnabled = ref(true);
|
||||
const globalConfig = ref(config);
|
||||
const loginForm = ref({
|
||||
username: "admin",
|
||||
password: "admin123",
|
||||
code: "",
|
||||
uuid: ''
|
||||
});
|
||||
|
||||
// 获取图形验证码
|
||||
function getCode() {
|
||||
getCodeImg().then(res => {
|
||||
captchaEnabled.value = res.captchaEnabled === undefined ? true : res.captchaEnabled
|
||||
if (captchaEnabled.value) {
|
||||
codeUrl.value = 'data:image/gif;base64,' + res.img
|
||||
loginForm.value.uuid = res.uuid
|
||||
}
|
||||
})
|
||||
};
|
||||
|
||||
async function handleLogin() {
|
||||
if (loginForm.value.username === "") {
|
||||
modal.msgError("请输入您的账号")
|
||||
} else if (loginForm.value.password === "") {
|
||||
modal.msgError("请输入您的密码")
|
||||
} else if (loginForm.value.code === "" && captchaEnabled.value) {
|
||||
modal.msgError("请输入验证码")
|
||||
} else {
|
||||
modal.loading("登录中，请耐心等待...")
|
||||
pwdLogin()
|
||||
}
|
||||
};
|
||||
// 密码登录
|
||||
async function pwdLogin() {
|
||||
store.dispatch('Login', loginForm.value).then(() => {
|
||||
modal.closeLoading()
|
||||
loginSuccess()
|
||||
}).catch(() => {
|
||||
if (captchaEnabled.value) {
|
||||
modal.closeLoading()
|
||||
getCode()
|
||||
}
|
||||
})
|
||||
};
|
||||
|
||||
function loginSuccess(result) {
|
||||
// 设置用户信息
|
||||
store.dispatch('GetInfo').then(res => {
|
||||
|
||||
uni.switchTab({
|
||||
url: '/pages/index'
|
||||
});
|
||||
})
|
||||
}
|
||||
|
||||
// 隐私协议
|
||||
function handlePrivacy() {
|
||||
let site = globalConfig.value.appInfo.agreements[0];
|
||||
uni.navigateTo({
|
||||
url: `/pages/common/webview/index?title=${site.title}&url=${site.url}`
|
||||
});
|
||||
};
|
||||
// 用户协议
|
||||
function handleUserAgrement() {
|
||||
let site = globalConfig.value.appInfo.agreements[1]
|
||||
uni.navigateTo({
|
||||
url: `/pages/common/webview/index?title=${site.title}&url=${site.url}`
|
||||
});
|
||||
};
|
||||
|
||||
getCode();
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.normal-login-container {
|
||||
width: 100%;
|
||||
|
||||
.logo-content {
|
||||
width: 100%;
|
||||
font-size: 21px;
|
||||
text-align: center;
|
||||
padding-top: 15%;
|
||||
|
||||
image {
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.title {
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.login-form-content {
|
||||
text-align: center;
|
||||
margin: 20px auto;
|
||||
margin-top: 15%;
|
||||
width: 80%;
|
||||
|
||||
.input-item {
|
||||
margin: 20px auto;
|
||||
background-color: #f5f6f7;
|
||||
height: 45px;
|
||||
border-radius: 20px;
|
||||
|
||||
.icon {
|
||||
font-size: 38rpx;
|
||||
margin-left: 10px;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.input {
|
||||
width: 100%;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
text-align: left;
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.login-btn {
|
||||
margin-top: 40px;
|
||||
height: 45px;
|
||||
}
|
||||
|
||||
.xieyi {
|
||||
color: #333;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.login-code {
|
||||
height: 38px;
|
||||
float: right;
|
||||
|
||||
.login-code-img {
|
||||
height: 38px;
|
||||
position: absolute;
|
||||
margin-left: 10px;
|
||||
width: 200rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,113 @@
|
||||
export default [
|
||||
{
|
||||
groupName: '部件',
|
||||
groupName_en: 'Parts',
|
||||
list: [
|
||||
{
|
||||
path: '/pages_template/pages/coupon/index',
|
||||
icon: 'coupon',
|
||||
title: 'Coupon 优惠券',
|
||||
title_en: 'Coupon',
|
||||
},
|
||||
{
|
||||
path: '/pages_template/pages/citySelect/index',
|
||||
icon: 'citySelect',
|
||||
title: 'CitySelect 城市选择',
|
||||
title_en: 'CitySelect',
|
||||
},
|
||||
{
|
||||
path: '/pages_template/pages/submitBar/index',
|
||||
icon: 'submitBar',
|
||||
title: 'SubmitBar 提交订单栏',
|
||||
title_en: 'SubmitBar',
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
groupName: '报表',
|
||||
groupName_en: 'Parts',
|
||||
list: [
|
||||
{
|
||||
path: '/pages_qiun/pages/finance/index',
|
||||
icon: 'coupon',
|
||||
title: '财务报告',
|
||||
title_en: 'finace',
|
||||
},
|
||||
{
|
||||
path: '/pages_qiun/pages/main/index',
|
||||
icon: 'coupon',
|
||||
title: '数据报表中心',
|
||||
title_en: 'main',
|
||||
},
|
||||
{
|
||||
path: '/pages_qiun/pages/school/index',
|
||||
icon: 'coupon',
|
||||
title: '智慧教育报表中心',
|
||||
title_en: 'school',
|
||||
},
|
||||
{
|
||||
path: '/pages_qiun/pages/sport/index',
|
||||
icon: 'coupon',
|
||||
title: '运动报告',
|
||||
title_en: 'sport',
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
groupName: '页面',
|
||||
groupName_en: 'Page',
|
||||
list: [
|
||||
{
|
||||
path: '/pages_template/pages/wxCenter/index',
|
||||
icon: 'wxCenter',
|
||||
title: 'WxCenter 仿微信个人中心',
|
||||
title_en: 'WxCenter',
|
||||
},
|
||||
{
|
||||
path: '/pages_template/pages/keyboardPay/index',
|
||||
icon: 'keyboardPay',
|
||||
title: 'KeyboardPay 自定义键盘支付模板',
|
||||
title_en: 'KeyboardPay',
|
||||
},
|
||||
{
|
||||
path: '/pages_template/pages/mallMenu/index1',
|
||||
icon: 'mall_menu_1',
|
||||
title: 'MallMenu 垂直分类(左右独立)',
|
||||
title_en: 'MallMenu 1',
|
||||
}, {
|
||||
path: '/pages_template/pages/mallMenu/index2',
|
||||
icon: 'mall_menu_2',
|
||||
title: 'MallMenu 垂直分类(左右联动)',
|
||||
title_en: 'MallMenu 2',
|
||||
}, {
|
||||
path: '/pages_template/pages/comment/index',
|
||||
icon: 'comment',
|
||||
title: 'Comment 评论列表',
|
||||
title_en: 'Comment',
|
||||
}, {
|
||||
path: '/pages_template/pages/order/index',
|
||||
icon: 'order',
|
||||
title: 'Order 订单列表',
|
||||
title_en: 'Order',
|
||||
},
|
||||
{
|
||||
path: '/pages_template/pages/login/index1',
|
||||
icon: 'login',
|
||||
title: 'Login 登录界面',
|
||||
title_en: 'Login',
|
||||
},
|
||||
{
|
||||
path: '/pages_template/pages/login/index2',
|
||||
icon: 'login',
|
||||
title: 'Login 水滴登录',
|
||||
title_en: 'Login',
|
||||
},
|
||||
{
|
||||
path: '/pages_template/pages/address/index',
|
||||
icon: 'address',
|
||||
title: 'Address 收货地址',
|
||||
title_en: 'Address',
|
||||
},
|
||||
]
|
||||
}
|
||||
]
|
||||
@ -0,0 +1,184 @@
|
||||
<template>
|
||||
<view class="work-container">
|
||||
<!-- 轮播图 -->
|
||||
<uni-swiper-dot class="uni-swiper-dot-box" :info="data" :current="current" field="content">
|
||||
<swiper class="swiper-box" :current="swiperDotIndex" @change="changeSwiper">
|
||||
<swiper-item v-for="(item, index) in data" :key="index">
|
||||
<view class="swiper-item" @click="clickBannerItem(item)">
|
||||
<image :src="item.image" mode="aspectFill" :draggable="false" />
|
||||
</view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</uni-swiper-dot>
|
||||
|
||||
<!-- 宫格组件 -->
|
||||
<uni-section title="系统管理" type="line"></uni-section>
|
||||
<view class="grid-body">
|
||||
<uni-grid :column="4" :showBorder="false" @change="changeGrid">
|
||||
<uni-grid-item>
|
||||
<view class="grid-item-box">
|
||||
<uni-icons type="person-filled" size="30"></uni-icons>
|
||||
<text class="text">用户管理</text>
|
||||
</view>
|
||||
</uni-grid-item>
|
||||
<uni-grid-item>
|
||||
<view class="grid-item-box">
|
||||
<uni-icons type="staff-filled" size="30"></uni-icons>
|
||||
<text class="text">角色管理</text>
|
||||
</view>
|
||||
</uni-grid-item>
|
||||
<uni-grid-item>
|
||||
<view class="grid-item-box">
|
||||
<uni-icons type="color" size="30"></uni-icons>
|
||||
<text class="text">菜单管理</text>
|
||||
</view>
|
||||
</uni-grid-item>
|
||||
<uni-grid-item>
|
||||
<view class="grid-item-box">
|
||||
<uni-icons type="settings-filled" size="30"></uni-icons>
|
||||
<text class="text">部门管理</text>
|
||||
</view>
|
||||
</uni-grid-item>
|
||||
<uni-grid-item>
|
||||
<view class="grid-item-box">
|
||||
<uni-icons type="heart-filled" size="30"></uni-icons>
|
||||
<text class="text">岗位管理</text>
|
||||
</view>
|
||||
</uni-grid-item>
|
||||
<uni-grid-item>
|
||||
<view class="grid-item-box">
|
||||
<uni-icons type="bars" size="30"></uni-icons>
|
||||
<text class="text">字典管理</text>
|
||||
</view>
|
||||
</uni-grid-item>
|
||||
<uni-grid-item>
|
||||
<view class="grid-item-box">
|
||||
<uni-icons type="gear-filled" size="30"></uni-icons>
|
||||
<text class="text">参数设置</text>
|
||||
</view>
|
||||
</uni-grid-item>
|
||||
<uni-grid-item>
|
||||
<view class="grid-item-box">
|
||||
<uni-icons type="chat-filled" size="30"></uni-icons>
|
||||
<text class="text">通知公告</text>
|
||||
</view>
|
||||
</uni-grid-item>
|
||||
<uni-grid-item>
|
||||
<view class="grid-item-box">
|
||||
<uni-icons type="wallet-filled" size="30"></uni-icons>
|
||||
<text class="text">日志管理</text>
|
||||
</view>
|
||||
</uni-grid-item>
|
||||
</uni-grid>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from "vue";
|
||||
import modal from "@/plugins/modal"
|
||||
const current=ref(0);
|
||||
const swiperDotIndex=ref(0);
|
||||
const data=ref([{
|
||||
image: '/static/images/banner/banner01.jpg'
|
||||
},
|
||||
{
|
||||
image: '/static/images/banner/banner02.jpg'
|
||||
},
|
||||
{
|
||||
image: '/static/images/banner/banner03.jpg'
|
||||
}
|
||||
]);
|
||||
|
||||
function clickBannerItem(item) {
|
||||
console.info(item)
|
||||
};
|
||||
function changeSwiper(e) {
|
||||
current.value = e.detail.current
|
||||
}
|
||||
function changeGrid(e) {
|
||||
modal.showToast({
|
||||
title: '模块建设中',
|
||||
mask: false,
|
||||
icon:'loading',
|
||||
duration: 1000
|
||||
});
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
/* #ifndef APP-NVUE */
|
||||
page {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
min-height: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
view {
|
||||
font-size: 14px;
|
||||
line-height: inherit;
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
|
||||
.text {
|
||||
text-align: center;
|
||||
font-size: 26rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
.grid-item-box {
|
||||
flex: 1;
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 15px 0;
|
||||
}
|
||||
|
||||
.uni-margin-wrap {
|
||||
width: 690rpx;
|
||||
width: 100%;
|
||||
;
|
||||
}
|
||||
|
||||
.swiper {
|
||||
height: 300rpx;
|
||||
}
|
||||
|
||||
.swiper-box {
|
||||
height: 150px;
|
||||
}
|
||||
|
||||
.swiper-item {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #fff;
|
||||
height: 300rpx;
|
||||
line-height: 300rpx;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 500px) {
|
||||
.uni-swiper-dot-box {
|
||||
width: 400px;
|
||||
/* #ifndef APP-NVUE */
|
||||
margin: 0 auto;
|
||||
/* #endif */
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.image {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,71 @@
|
||||
<template>
|
||||
<view class="about-container">
|
||||
<view class="header-section text-center">
|
||||
<image style="width: 150rpx;height: 150rpx;" src="/static/logo200.png" mode="widthFix">
|
||||
</image>
|
||||
<uni-title type="h2" title="若依移动端"></uni-title>
|
||||
</view>
|
||||
|
||||
<view class="content-section">
|
||||
<view class="menu-list">
|
||||
<view class="list-cell list-cell-arrow">
|
||||
<view class="menu-item-box">
|
||||
<view>版本信息</view>
|
||||
<view class="text-right">v{{version}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list-cell list-cell-arrow">
|
||||
<view class="menu-item-box">
|
||||
<view>官方邮箱</view>
|
||||
<view class="text-right">ruoyi@xx.com</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list-cell list-cell-arrow">
|
||||
<view class="menu-item-box">
|
||||
<view>服务热线</view>
|
||||
<view class="text-right">400-999-9999</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list-cell list-cell-arrow">
|
||||
<view class="menu-item-box">
|
||||
<view>公司网站</view>
|
||||
<view class="text-right">
|
||||
<uni-link :href="url" :text="url" showUnderLine="false"></uni-link>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="copyright">
|
||||
<view>Copyright © 2022 ruoyi.vip All Rights Reserved.</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import config from '@/config.js'
|
||||
const url=config.appInfo.site_url;
|
||||
const version=config.appInfo.version;
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #f8f8f8;
|
||||
}
|
||||
|
||||
.copyright {
|
||||
margin-top: 50rpx;
|
||||
text-align: center;
|
||||
line-height: 60rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.header-section {
|
||||
display: flex;
|
||||
padding: 30rpx 0 0;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,109 @@
|
||||
<template>
|
||||
<view class="help-container">
|
||||
<view v-for="(item, findex) in list" :key="findex" :title="item.title" class="list-title">
|
||||
<view class="text-title">
|
||||
<view :class="item.icon"></view>{{ item.title }}
|
||||
</view>
|
||||
<view class="childList">
|
||||
<view v-for="(child, zindex) in item.childList" :key="zindex" class="question" hover-class="hover"
|
||||
@click="handleText(child)">
|
||||
<view class="text-item">{{ child.title }}</view>
|
||||
<view class="line" v-if="zindex !== item.childList.length - 1"></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from "vue";
|
||||
|
||||
const list =ref([{
|
||||
icon: 'iconfont icon-github',
|
||||
title: '若依问题',
|
||||
childList: [{
|
||||
title: '若依开源吗？',
|
||||
content: '开源'
|
||||
}, {
|
||||
title: '若依可以商用吗？',
|
||||
content: '可以'
|
||||
}, {
|
||||
title: '若依官网地址多少？',
|
||||
content: 'http://ruoyi.vip'
|
||||
}, {
|
||||
title: '若依文档地址多少？',
|
||||
content: 'http://doc.ruoyi.vip'
|
||||
}]
|
||||
},
|
||||
{
|
||||
icon: 'iconfont icon-help',
|
||||
title: '其他问题',
|
||||
childList: [{
|
||||
title: '如何退出登录？',
|
||||
content: '请点击[我的] - [应用设置] - [退出登录]即可退出登录',
|
||||
}, {
|
||||
title: '如何修改用户头像？',
|
||||
content: '请点击[我的] - [选择头像] - [点击提交]即可更换用户头像',
|
||||
}, {
|
||||
title: '如何修改登录密码？',
|
||||
content: '请点击[我的] - [应用设置] - [修改密码]即可修改登录密码',
|
||||
}]
|
||||
}
|
||||
])
|
||||
|
||||
function handleText(item) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/common/textview/index?title=${item.title}&content=${item.content}`
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
page {
|
||||
background-color: #f8f8f8;
|
||||
}
|
||||
|
||||
.help-container {
|
||||
margin-bottom: 100rpx;
|
||||
padding: 30rpx;
|
||||
}
|
||||
|
||||
.list-title {
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
|
||||
.childList {
|
||||
background: #ffffff;
|
||||
box-shadow: 0px 0px 10rpx rgba(193, 193, 193, 0.2);
|
||||
border-radius: 16rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
.line {
|
||||
width: 100%;
|
||||
height: 1rpx;
|
||||
background-color: #F5F5F5;
|
||||
}
|
||||
|
||||
.text-title {
|
||||
color: #303133;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
margin-left: 10rpx;
|
||||
|
||||
.iconfont {
|
||||
font-size: 16px;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.text-item {
|
||||
font-size: 28rpx;
|
||||
padding: 24rpx;
|
||||
}
|
||||
|
||||
.question {
|
||||
color: #606266;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,132 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="example">
|
||||
<uni-forms ref="form" :model="user" labelWidth="80px">
|
||||
<uni-forms-item label="用户昵称" name="nickName">
|
||||
<uni-easyinput v-model="user.nickName" placeholder="请输入昵称" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="手机号码" name="phonenumber">
|
||||
<uni-easyinput v-model="user.phonenumber" placeholder="请输入手机号码" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="邮箱" name="email">
|
||||
<uni-easyinput v-model="user.email" placeholder="请输入邮箱" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="性别" name="sex" required>
|
||||
<uni-data-checkbox v-model="user.sex" :localdata="sexs" />
|
||||
</uni-forms-item>
|
||||
</uni-forms>
|
||||
<button type="primary" @click="submit">提交</button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getUserProfile } from "@/api/system/user"
|
||||
import { updateUserProfile } from "@/api/system/user"
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
user: {
|
||||
nickName: "",
|
||||
phonenumber: "",
|
||||
email: "",
|
||||
sex: ""
|
||||
},
|
||||
sexs: [{
|
||||
text: '男',
|
||||
value: "0"
|
||||
}, {
|
||||
text: '女',
|
||||
value: "1"
|
||||
}],
|
||||
rules: {
|
||||
nickName: {
|
||||
rules: [{
|
||||
required: true,
|
||||
errorMessage: '用户昵称不能为空'
|
||||
}]
|
||||
},
|
||||
phonenumber: {
|
||||
rules: [{
|
||||
required: true,
|
||||
errorMessage: '手机号码不能为空'
|
||||
}, {
|
||||
pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
|
||||
errorMessage: '请输入正确的手机号码'
|
||||
}]
|
||||
},
|
||||
email: {
|
||||
rules: [{
|
||||
required: true,
|
||||
errorMessage: '邮箱地址不能为空'
|
||||
}, {
|
||||
format: 'email',
|
||||
errorMessage: '请输入正确的邮箱地址'
|
||||
}]
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.getUser()
|
||||
},
|
||||
onReady() {
|
||||
this.$refs.form.setRules(this.rules)
|
||||
},
|
||||
methods: {
|
||||
getUser() {
|
||||
getUserProfile().then(response => {
|
||||
this.user = response.data
|
||||
})
|
||||
},
|
||||
submit(ref) {
|
||||
this.$refs.form.validate().then(res => {
|
||||
updateUserProfile(this.user).then(response => {
|
||||
uni.showToast({
|
||||
title: '修改成功',
|
||||
mask: false,
|
||||
duration: 1000
|
||||
});
|
||||
uni.navigateBack();
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.example {
|
||||
padding: 15px;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.segmented-control {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.button-group {
|
||||
margin-top: 15px;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
}
|
||||
|
||||
.form-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.button {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 35px;
|
||||
line-height: 35px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,44 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<uni-list>
|
||||
<uni-list-item showExtraIcon="true" :extraIcon="{type: 'person-filled'}" title="昵称" :rightText="user.nickName" />
|
||||
<uni-list-item showExtraIcon="true" :extraIcon="{type: 'phone-filled'}" title="手机号码" :rightText="user.phonenumber" />
|
||||
<uni-list-item showExtraIcon="true" :extraIcon="{type: 'email-filled'}" title="邮箱" :rightText="user.email" />
|
||||
<uni-list-item showExtraIcon="true" :extraIcon="{type: 'auth-filled'}" title="岗位" :rightText="postGroup" />
|
||||
<uni-list-item showExtraIcon="true" :extraIcon="{type: 'staff-filled'}" title="角色" :rightText="roleGroup" />
|
||||
<uni-list-item showExtraIcon="true" :extraIcon="{type: 'calendar-filled'}" title="创建日期" :rightText="user.createTime" />
|
||||
</uni-list>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getUserProfile } from "@/api/system/user"
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
user: {},
|
||||
roleGroup: "",
|
||||
postGroup: ""
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.getUser()
|
||||
},
|
||||
methods: {
|
||||
getUser() {
|
||||
getUserProfile().then(response => {
|
||||
this.user = response.data
|
||||
this.roleGroup = response.roleGroup
|
||||
this.postGroup = response.postGroup
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,91 @@
|
||||
<template>
|
||||
<view class="pwd-retrieve-container">
|
||||
<uni-forms ref="form" :value="user" labelWidth="80px">
|
||||
<uni-forms-item name="oldPassword" label="旧密码">
|
||||
<uni-easyinput type="password" v-model="user.oldPassword" placeholder="请输入旧密码" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item name="newPassword" label="新密码">
|
||||
<uni-easyinput type="password" v-model="user.newPassword" placeholder="请输入新密码" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item name="confirmPassword" label="确认密码">
|
||||
<uni-easyinput type="password" v-model="user.confirmPassword" placeholder="请确认新密码" />
|
||||
</uni-forms-item>
|
||||
<button type="primary" @click="submit">提交</button>
|
||||
</uni-forms>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { updateUserPwd } from "@/api/system/user"
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
user: {
|
||||
oldPassword: undefined,
|
||||
newPassword: undefined,
|
||||
confirmPassword: undefined
|
||||
},
|
||||
rules: {
|
||||
oldPassword: {
|
||||
rules: [{
|
||||
required: true,
|
||||
errorMessage: '旧密码不能为空'
|
||||
}]
|
||||
},
|
||||
newPassword: {
|
||||
rules: [{
|
||||
required: true,
|
||||
errorMessage: '新密码不能为空',
|
||||
},
|
||||
{
|
||||
minLength: 6,
|
||||
maxLength: 20,
|
||||
errorMessage: '长度在 6 到 20 个字符'
|
||||
}
|
||||
]
|
||||
},
|
||||
confirmPassword: {
|
||||
rules: [{
|
||||
required: true,
|
||||
errorMessage: '确认密码不能为空'
|
||||
}, {
|
||||
validateFunction: (rule, value, data) => data.newPassword === value,
|
||||
errorMessage: '两次输入的密码不一致'
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
onReady() {
|
||||
this.$refs.form.setRules(this.rules)
|
||||
},
|
||||
methods: {
|
||||
submit() {
|
||||
this.$refs.form.validate().then(res => {
|
||||
updateUserPwd(this.user.oldPassword, this.user.newPassword).then(response => {
|
||||
uni.showToast({
|
||||
title: '修改成功',
|
||||
mask: false,
|
||||
duration: 1000
|
||||
});
|
||||
uni.navigateBack();
|
||||
})
|
||||
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.pwd-retrieve-container {
|
||||
padding-top: 36rpx;
|
||||
padding: 15px;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,105 @@
|
||||
<template>
|
||||
<view class="setting-container" :style="{height: `${windowHeight}px`}">
|
||||
<view class="menu-list">
|
||||
<view class="list-cell list-cell-arrow" @click="handleToPwd">
|
||||
<view class="menu-item-box">
|
||||
<view class="iconfont icon-password menu-icon"></view>
|
||||
<view>修改密码</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list-cell list-cell-arrow" @click="handleToUpgrade">
|
||||
<view class="menu-item-box">
|
||||
<view class="iconfont icon-refresh menu-icon"></view>
|
||||
<view>检查更新</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list-cell list-cell-arrow" @click="handleCleanTmp">
|
||||
<view class="menu-item-box">
|
||||
<view class="iconfont icon-clean menu-icon"></view>
|
||||
<view>清理缓存</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="cu-list menu">
|
||||
<view class="cu-item item-box">
|
||||
<view class="content text-center" @click="handleLogout">
|
||||
<text class="text-black">退出登录</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<uni-popup ref="popup" type="dialog">
|
||||
<uni-popup-dialog type="info" cancelText="关闭" confirmText="退出"
|
||||
title="通知" content="确定注销并退出系统吗"
|
||||
@confirm="dialogConfirm"
|
||||
@close="dialogClose">
|
||||
</uni-popup-dialog>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from "vue";
|
||||
import store from '@/store'
|
||||
|
||||
const windowHeight=ref(uni.getSystemInfoSync().windowHeight) ;
|
||||
const popup = ref(null);
|
||||
|
||||
function handleToPwd() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/mine/pwd/index'
|
||||
});
|
||||
};
|
||||
|
||||
function handleToUpgrade() {
|
||||
uni.showToast({
|
||||
title: '模块建设中~',
|
||||
mask: false,
|
||||
icon:"none",
|
||||
duration: 1000
|
||||
});
|
||||
};
|
||||
|
||||
function handleCleanTmp() {
|
||||
uni.showToast({
|
||||
title: '模块建设中~',
|
||||
mask: false,
|
||||
icon:"none",
|
||||
duration: 1000
|
||||
});
|
||||
};
|
||||
function handleLogout() {
|
||||
popup.value.open();
|
||||
};
|
||||
function dialogConfirm() {
|
||||
//console.log('----------------点击确认------------')
|
||||
store.dispatch('LogOut').then(() => {
|
||||
uni.reLaunch({
|
||||
url: '/pages/login'
|
||||
});
|
||||
})
|
||||
};
|
||||
function dialogClose() {
|
||||
//console.log('点击关闭')
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.page {
|
||||
background-color: #f8f8f8;
|
||||
}
|
||||
|
||||
.item-box {
|
||||
background-color: #FFFFFF;
|
||||
margin: 30rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 10rpx;
|
||||
border-radius: 8rpx;
|
||||
color: #303133;
|
||||
font-size: 32rpx;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,147 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="top-swiper">
|
||||
<view class="box">
|
||||
<view style="height: 44px;"></view>
|
||||
<swiper class="swiper" :previous-margin="swiper.margin" :next-margin='swiper.margin' :circular="true"
|
||||
@change="swiperChange">
|
||||
<swiper-item v-for="(item,index) in card_menu" :key="index" @click="toUrl(item.url)">
|
||||
<!-- <image class='le-img' :src='item' :class="{'le-active':swiper.index == index}"></image> -->
|
||||
<view class="le-img" :class="{'le-active':swiper.index == index}">
|
||||
<view class="img_box">
|
||||
<image class="card_img" :src="item.img" mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="detail_box">
|
||||
<view class="title_box">{{item.title}}</view>
|
||||
<view class="author_box">By:{{item.author}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
card_menu: {
|
||||
type: Array,
|
||||
default: []
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
swiper: {
|
||||
margin: "150rpx",
|
||||
index: 0,
|
||||
list: [
|
||||
"/static/images/douyin/0.jpg",
|
||||
"/static/images/douyin/4.jpg",
|
||||
"/static/images/douyin/7.jpg",
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
components: {
|
||||
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
//swiper滑动事件
|
||||
swiperChange: function(e) {
|
||||
this.swiper.index = e.detail.current;
|
||||
},
|
||||
toUrl(url){
|
||||
this.$Common.navigateTo(url);
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.top-swiper {
|
||||
margin-bottom: 30rpx;
|
||||
|
||||
.box {
|
||||
padding-top: var(--status-bar-height);
|
||||
box-sizing: content-box;
|
||||
position: absolute;
|
||||
z-index: 5;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.swiper {
|
||||
height: 600rpx;
|
||||
margin: 0 20rpx;
|
||||
|
||||
.le-img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
transform: scale(0.9);
|
||||
transition: transform 0.3s ease-in-out 0s;
|
||||
border-radius: 10px;
|
||||
background-color: #fff;
|
||||
overflow: hidden;
|
||||
|
||||
&.le-active {
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
.img_box {
|
||||
width: 100%;
|
||||
height: 65%;
|
||||
overflow: hidden;
|
||||
|
||||
.card_img {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.detail_box {
|
||||
width: 100%;
|
||||
height: 35%;
|
||||
overflow: hidden;
|
||||
|
||||
.title_box {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-size: 40rpx;
|
||||
margin: 30rpx 0;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.author_box {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-size: 30rpx;
|
||||
position: relative;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
height: 1px;
|
||||
width: 150rpx;
|
||||
position: absolute;
|
||||
transform: translateX(-50%);
|
||||
left: 50%;
|
||||
top: 0;
|
||||
background: #000;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,139 @@
|
||||
<template>
|
||||
<view class="content">
|
||||
<scroll-view v-if="true" scroll-y class="data_body" :style="{height:scrollHeight}">
|
||||
<!--数据进度条-->
|
||||
<view class="progress">
|
||||
<data-progress :progressList="userHealthyLineBar" :borderRadius="20" padMiddle="true"></data-progress>
|
||||
</view>
|
||||
<view class="split_line"></view>
|
||||
|
||||
<!-- 新增小程序会员趋势-->
|
||||
<view class="friend_operate">
|
||||
<text-block :content="baseData"></text-block>
|
||||
<view class="trend_title">新增小程序会员趋势</view>
|
||||
<view class="charts-box">
|
||||
<qiun-data-charts
|
||||
type="mix"
|
||||
canvasId="three_a"
|
||||
:canvas2d="isCanvas2d"
|
||||
:reshow="delayload"
|
||||
:opts="{yAxis:{data:[{position: 'left',title: '销售额/万',max:userTrand?userTrand.yAxis[0].max:0,min:userTrand?userTrand.yAxis[0].min:0},{position: 'right',title: '',max:userTrand?userTrand.yAxis[1].max:0,min:userTrand?userTrand.yAxis[1].min:0,unit:'%'}]}}"
|
||||
:chartData="userTrand"/>
|
||||
</view>
|
||||
</view>
|
||||
<view class="split_line"></view>
|
||||
|
||||
<!-- 会员扫码率趋势-->
|
||||
<view class="friend_operate">
|
||||
<text-block :content="scanTrand"></text-block>
|
||||
<view class="trend_title">会员扫码率趋势</view>
|
||||
<view class="charts-box">
|
||||
<qiun-data-charts
|
||||
type="mix"
|
||||
canvasId="three_b"
|
||||
:canvas2d="isCanvas2d"
|
||||
:reshow="delayload"
|
||||
:opts="{yAxis:{data:[{position: 'left',title: '',max:scanTrandPrecent?scanTrandPrecent.yAxis[0].max:0,min:scanTrandPrecent?scanTrandPrecent.yAxis[0].min:0,unit:'%'}]}}"
|
||||
:chartData="scanTrandPrecent"/>
|
||||
</view>
|
||||
</view>
|
||||
<view class="split_line"></view>
|
||||
|
||||
<!-- 小程序活跃会员占比-->
|
||||
<view class="friend_operate">
|
||||
<text-block :content="miniActive"></text-block>
|
||||
<view class="charts-box">
|
||||
<qiun-data-charts
|
||||
type="mix"
|
||||
canvasId="three_c"
|
||||
:canvas2d="isCanvas2d"
|
||||
:reshow="delayload"
|
||||
:opts="{yAxis:{data:[{position: 'left',title: '销售额/万',max:miniActivePrecent?miniActivePrecent.yAxis[0].max:0,min:miniActivePrecent?miniActivePrecent.yAxis[0].min:0},{position: 'right',title: '',max:miniActivePrecent?miniActivePrecent.yAxis[1].max:0,min:miniActivePrecent?miniActivePrecent.yAxis[1].min:0,unit:'%'}]}}"
|
||||
:chartData="miniActivePrecent"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<view v-else class="container padding_stand-big normal_color">
|
||||
<li class="iconfont icon-cry cry"></li>暂无数据
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import DataProgress from "../data-progress/data-progress.vue"
|
||||
|
||||
import userHealthyLineBar from '../../static/json/user-healthy/1.json';
|
||||
import baseData from '../../static/json/user-healthy/2.json';
|
||||
import userTrand from '../../static/json/user-healthy/3.json';
|
||||
|
||||
import scanTrand from '../../static/json/user-healthy/4.json';
|
||||
import scanTrandPrecent from '../../static/json/user-healthy/5.json';
|
||||
import miniActive from '../../static/json/user-healthy/6.json';
|
||||
import miniActivePrecent from '../../static/json/user-healthy/7.json';
|
||||
|
||||
var _self;
|
||||
export default {
|
||||
name:'user-healthy',
|
||||
props: {
|
||||
scrollHeight:{
|
||||
type:String,
|
||||
default:"600px"
|
||||
}
|
||||
},
|
||||
components:{
|
||||
DataProgress
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
userHealthyLineBar,
|
||||
baseData,
|
||||
userTrand,
|
||||
scanTrand,
|
||||
scanTrandPrecent,
|
||||
miniActive,
|
||||
miniActivePrecent,
|
||||
delayload:false,
|
||||
isCanvas2d:this.$Config.ISCANVAS2D,
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getData();
|
||||
},
|
||||
methods:{
|
||||
async getData(){
|
||||
uni.showLoading();
|
||||
await setTimeout(() => {
|
||||
this.delayload = true;
|
||||
uni.hideLoading();
|
||||
}, 1000)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.content{
|
||||
padding-top: 10rpx;
|
||||
.progress,.firend_operate{
|
||||
padding: 0 10rpx;
|
||||
}
|
||||
.progress{
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
.friend_operate{
|
||||
padding: 30rpx 10rpx;
|
||||
.title{
|
||||
text-align:left;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
.trend_title{
|
||||
text-align: right;
|
||||
font-size: 22rpx;
|
||||
color: #ff9900;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -0,0 +1,130 @@
|
||||
<template>
|
||||
<view class="content">
|
||||
<scroll-view v-if="true" scroll-y class="data_body" :style="{height:scrollHeight}">
|
||||
<!--数据进度条-->
|
||||
<view class="progress">
|
||||
<data-progress :progressList="wechatLineBar" :borderRadius="20" padMiddle="true"></data-progress>
|
||||
</view>
|
||||
<view class="split_line"></view>
|
||||
|
||||
<!-- 微好友运营-->
|
||||
<view class="friend_operate">
|
||||
<view class="title">微好友运营</view>
|
||||
<text-block :content="friendTextBlock"></text-block>
|
||||
<view style="display: flex;justify-content: space-around;">
|
||||
<view v-for="(item,index) in panelData" :key="index" class="charts-box"
|
||||
style="width: 45%;height: 200px;">
|
||||
<qiun-data-charts type="gauge"
|
||||
:opts="{title:{name: item.series[0].data * 100 + '%',color: '#24ABFD',offsetY:30},subtitle: {name: item.series[0].name,color: '#666666',fontSize: 15,offsetY:70},extra:{gauge:{type:'progress',width:20,splitLine:{fixRadius:-10,width:15,},}}}"
|
||||
:chartData="item" :reshow="delayload" :canvas2d="isCanvas2d" :canvasId="'one_a_' + index" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="trend_title">新增微好友&小程序会员趋势</view>
|
||||
<view class="charts-box">
|
||||
<qiun-data-charts type="mix" :chartData="friendTrand" :reshow="delayload"
|
||||
:canvas2d="isCanvas2d" canvasId="one_b" :opts="{yAxis:{data:[{title: ''}]}}" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="split_line"></view>
|
||||
|
||||
<!-- 微客群运营-->
|
||||
<view class="friend_operate">
|
||||
<view class="title">微客群运营</view>
|
||||
<text-block :content="friendTextBlock"></text-block>
|
||||
<view class="trend_title">新增人群&退群人数趋势</view>
|
||||
<view class="charts-box">
|
||||
<qiun-data-charts type="mix" :chartData="teamTrand" :reshow="delayload" :canvas2d="isCanvas2d"
|
||||
canvasId="one_c" :opts="{yAxis:{data:[{title: '',max:teamTrand?teamTrand.yAxis[0].max:0,min:teamTrand?teamTrand.yAxis[0].min:0}]}}" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="split_line"></view>
|
||||
|
||||
<!-- 客户联系-->
|
||||
<view class="friend_operate">
|
||||
<view class="title">【客户联系】1对1运营执行</view>
|
||||
<senior-table :headers="dataTable.headers" :contents="dataTable.contents" :urlCol="dataTable.urlCol" :firstLineFixed="true" :sortCol="dataTable.sortCol"></senior-table>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<view v-else class="container padding_stand-big normal_color">
|
||||
<li class="iconfont icon-cry cry"></li>暂无数据
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import DataProgress from "../data-progress/data-progress.vue"
|
||||
import SeniorTable from "../data-table/senior-table.vue"
|
||||
|
||||
import wechatLineBar from '../../static/json/wechat/1.json';
|
||||
import friendTextBlock from '../../static/json/wechat/2.json';
|
||||
import panelData from '../../static/json/wechat/3.json';
|
||||
import friendTrand from '../../static/json/wechat/4.json';
|
||||
import teamTrand from '../../static/json/wechat/5.json';
|
||||
import dataTable from "../../static/json/wechat/6.json"
|
||||
|
||||
export default {
|
||||
name:'wechat',
|
||||
props: {
|
||||
scrollHeight:{
|
||||
type:String,
|
||||
default:"600px"
|
||||
}
|
||||
},
|
||||
components:{
|
||||
DataProgress,
|
||||
SeniorTable,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
wechatLineBar,
|
||||
friendTextBlock,
|
||||
friendTrand,
|
||||
panelData,
|
||||
teamTrand,
|
||||
dataTable,
|
||||
scrollTop: 0,
|
||||
delayload: false,
|
||||
isCanvas2d: this.$Config.ISCANVAS2D,
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getData();
|
||||
},
|
||||
methods:{
|
||||
async getData() {
|
||||
uni.showLoading();
|
||||
await setTimeout(() => {
|
||||
this.delayload = true;
|
||||
uni.hideLoading();
|
||||
}, 1000)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.content{
|
||||
padding-top: 10rpx;
|
||||
.progress,.firend_operate{
|
||||
padding: 0 10rpx;
|
||||
}
|
||||
.progress{
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
.friend_operate{
|
||||
padding: 30rpx 20rpx;
|
||||
.title{
|
||||
text-align:left;
|
||||
margin-bottom: 30rpx;
|
||||
font-size: 40rpx;
|
||||
}
|
||||
.trend_title{
|
||||
text-align: right;
|
||||
font-size: 22rpx;
|
||||
color: #ff9900;
|
||||
margin-top: 50rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -0,0 +1,93 @@
|
||||
<template>
|
||||
<view class="column">
|
||||
<view v-for="(item,index) in progressList" :key="index" :class="['row','font-small','progress',padMiddle?'paddingMiddle':'']">
|
||||
<text class="title">{{item.name}}</text>
|
||||
<view class="body">
|
||||
<view class="number">{{item.now?item.now+"/":""}}{{item.expect}} [{{item.value}}%]</view>
|
||||
<progress :percent="item.value" backgroundColor="#C9C9C9"
|
||||
:border-radius="borderRadius?borderRadius+'rpx':'0px'"
|
||||
:color="time"
|
||||
stroke-width="16" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name:'data-progress',
|
||||
props: {
|
||||
progressList: {
|
||||
type: Array,
|
||||
default: ()=> {
|
||||
return []
|
||||
}
|
||||
},
|
||||
borderRadius:{
|
||||
type:Number,
|
||||
default:0
|
||||
},
|
||||
padMiddle:{
|
||||
type:String,
|
||||
default:"false"
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
time:0
|
||||
}
|
||||
},
|
||||
watch:{
|
||||
"progressList":{
|
||||
deep: true,
|
||||
handler: function(newVal, oldVal) {
|
||||
this.time = newVal.filter(x=>x.name=="时间进度")[0].value;
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.time = this.progressList.filter(x=>x.name=="时间进度")[0].value;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.paddingMiddle{
|
||||
padding: 18rpx 10rpx;
|
||||
}
|
||||
.progress{
|
||||
|
||||
.title{
|
||||
font-size: 28rpx;
|
||||
width: 170rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
.body{
|
||||
position: relative;
|
||||
flex: 1;
|
||||
|
||||
.number{
|
||||
color: #fff;
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
left: 26rpx;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
height: 44rpx;
|
||||
}
|
||||
progress{
|
||||
padding: 6rpx 0;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
</style>
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,218 @@
|
||||
<template>
|
||||
<div class="dropdown-item">
|
||||
<!-- selected -->
|
||||
<view :class="['dropdown-item__selected',listWidth!='150rpx'?'dropdown-item__right':'dropdown-item__left']"
|
||||
@click="changePopup" :style="{maxWidth:selectWidth}">
|
||||
<view class="selected__name">{{selectItem.text}}</view>
|
||||
<view class="selected__icon"
|
||||
:class="showClass === 'show'? 'up' : 'down'"
|
||||
>
|
||||
<li class="iconfont icon-caretdown"></li>
|
||||
</view>
|
||||
</view>
|
||||
<view class="dropdown-item__content" :style="{top: contentTop + 'rpx'}" v-if="showList">
|
||||
<!-- dropdown -->
|
||||
<view :class="['list', showClass]" :style="{left: contentLeft>0?contentLeft + 'rpx':'auto',right: contentRight>0?contentRight + 'rpx':'auto',}">
|
||||
<view class="list__option"
|
||||
v-for="(item, index) in list" :key="index"
|
||||
@click="choose(item)">
|
||||
<view>{{item.text}}</view>
|
||||
<icon v-if="item.value === value" type="success_no_circle" size="20"/>
|
||||
</view>
|
||||
</view>
|
||||
<!-- dropdown-mask -->
|
||||
<view :class="['dropdown-mask', showClass]" v-if="showList" @click="closePopup"></view>
|
||||
</view>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
components: {
|
||||
},
|
||||
props: {
|
||||
value: [Number, String, Object],
|
||||
list: {
|
||||
type: Array,
|
||||
default: ()=> {
|
||||
return []
|
||||
}
|
||||
},
|
||||
contentTop:{
|
||||
type:String,
|
||||
default:"185"
|
||||
},
|
||||
contentLeft:{
|
||||
type:String,
|
||||
default:"0"
|
||||
},
|
||||
contentRight:{
|
||||
type:String,
|
||||
default:"0"
|
||||
},
|
||||
listWidth:{
|
||||
type:String,
|
||||
default:'150rpx'
|
||||
},
|
||||
selectWidth:{
|
||||
type:String,
|
||||
default:'150rpx'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
showList: "",
|
||||
showClass: '',
|
||||
selectItem: {},
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
list(newVal,oldVal){
|
||||
this.selectItem = newVal[0];
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.showList = this.active;
|
||||
this.selectItem = this.list[0];
|
||||
},
|
||||
methods: {
|
||||
choose(item) {
|
||||
if(item.value != "auto"){
|
||||
this.selectItem = item
|
||||
}
|
||||
this.$emit('changeItem', item);
|
||||
this.closePopup();
|
||||
},
|
||||
selectAuto(){
|
||||
this.selectItem = {text: '指定日期',value: 'auto'};
|
||||
},
|
||||
changePopup() {
|
||||
if(this.showList) {
|
||||
this.closePopup()
|
||||
} else {
|
||||
this.openPopup()
|
||||
}
|
||||
},
|
||||
openPopup() {
|
||||
setTimeout(() => {
|
||||
this.showClass = 'show';
|
||||
this.showList = true;
|
||||
}, 100);
|
||||
},
|
||||
closePopup() {
|
||||
this.showClass = ''
|
||||
setTimeout(() => {
|
||||
this.showList = false
|
||||
}, 200);
|
||||
},
|
||||
close() {
|
||||
this.showClass = ''
|
||||
this.showList = false
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
li{
|
||||
list-style-type:none;
|
||||
}
|
||||
.dropdown-item__content{
|
||||
z-index: 10!important;
|
||||
}
|
||||
.dropdown-item {
|
||||
width: 100%;
|
||||
flex:1;
|
||||
position: relative;
|
||||
&__selected {
|
||||
position: relative;
|
||||
padding: 10rpx 0;
|
||||
box-sizing: border-box;
|
||||
color: #fff;
|
||||
.selected__name {
|
||||
font-size: 28rpx;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
.selected__icon {
|
||||
margin-left: 20rpx;
|
||||
&.down {
|
||||
transition: transform .3s;
|
||||
transform: rotateZ(0);
|
||||
}
|
||||
&.up {
|
||||
transition: transform .3s;
|
||||
transform: rotateZ(-180deg);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
&__left{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
}
|
||||
&__right{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
}
|
||||
&__content {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
overflow: hidden;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
z-index: 1;
|
||||
.list {
|
||||
max-height: 400px;
|
||||
text-align: center;
|
||||
overflow-y: auto;
|
||||
position: absolute;
|
||||
z-index: 1200;
|
||||
background: #fff;
|
||||
transform: translateY(-100%);
|
||||
transition: all .3s;
|
||||
&.show {
|
||||
transform: translateY(0);
|
||||
}
|
||||
&__option {
|
||||
font-size:30rpx;
|
||||
padding: 18rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
color: #303133;
|
||||
&:not(:last-child) {
|
||||
border-bottom: 1rpx solid #DDDDDD;
|
||||
}
|
||||
}
|
||||
}
|
||||
.dropdown-mask {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
transition: all .3s;
|
||||
z-index: 1100;
|
||||
&.show {
|
||||
background:rgba(0,0,0,0.5);
|
||||
}
|
||||
}
|
||||
}
|
||||
&:not(:last-child):after {
|
||||
content: ' ';
|
||||
position: absolute;
|
||||
width: 2rpx;
|
||||
top: 36rpx;
|
||||
bottom: 36rpx;
|
||||
right: 0;
|
||||
background: $uni-border-color;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,125 @@
|
||||
<template>
|
||||
<view>
|
||||
<view v-if="copyContent.length > 0" class="ranking">
|
||||
<view class="ranking-item" v-for="(content,index) in copyContent" :key="index" :style="{padding:progressPadding+'rpx'}">
|
||||
<view class="name">{{content.name}}</view>
|
||||
<view class="progress" >
|
||||
<text :style="{background:content.background,width:content.width + '%',height:progressWidth+'rpx'}"></text>
|
||||
</view>
|
||||
<view class="num">{{content.num}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default{
|
||||
name:'ranking-list',
|
||||
props:{
|
||||
content:{
|
||||
type: Array,
|
||||
default() {
|
||||
return []
|
||||
}
|
||||
},
|
||||
isPC:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
},
|
||||
isRank:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return{
|
||||
progressWidth:24,
|
||||
progressPadding:10,
|
||||
maxNumber:0,
|
||||
culCount:0,
|
||||
copyContent:[]
|
||||
}
|
||||
},
|
||||
watch:{
|
||||
content(newV){
|
||||
this.init()
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
init(){
|
||||
this.copyContent = this.deepClone(this.content)
|
||||
if(this.copyContent && this.copyContent.length >0){
|
||||
if(this.isRank){
|
||||
this.copyContent = this.copyContent.sort((a,b) => b.num - a.num);
|
||||
this.maxNumber = this.copyContent[0].num;
|
||||
}else{
|
||||
this.maxNumber = Math.max.apply(Math,this.copyContent.map(item => { return item.num }));
|
||||
}
|
||||
this.copyContent.map((item,index) =>{
|
||||
item.width = this.computeWidth(this.maxNumber,item.num);
|
||||
});
|
||||
}
|
||||
},
|
||||
computeWidth(max,current){
|
||||
let num = (current / max) * 100;
|
||||
return num.toFixed(2);
|
||||
},
|
||||
deepClone(obj) {
|
||||
var cloneObj = new obj.constructor()
|
||||
if(obj === null) return obj
|
||||
if(obj instanceof Date) return new Date(obj)
|
||||
if(obj instanceof RegExp) return new RegExp(obj)
|
||||
if (typeof obj !== 'object') return obj
|
||||
for (var i in obj) {
|
||||
if (obj.hasOwnProperty(i)) {
|
||||
cloneObj[i] = this.deepClone(obj[i])
|
||||
}
|
||||
}
|
||||
return cloneObj
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
if(this.isPC){
|
||||
this.progressWidth = 40;
|
||||
this.progressPadding = 30;
|
||||
}
|
||||
this.init();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.ranking-item{
|
||||
display: flex;
|
||||
margin-bottom: 13rpx;
|
||||
align-content: center;
|
||||
height: 50rpx;
|
||||
|
||||
.name{
|
||||
padding-right: 10rpx;
|
||||
color: #868688;
|
||||
font-size: 20rpx;
|
||||
flex: 1;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.progress{
|
||||
flex:5;
|
||||
text-align: left;
|
||||
padding-right: 10rpx;
|
||||
|
||||
text{
|
||||
display: inline-block;
|
||||
border-radius: 30rpx;
|
||||
vertical-align:top;
|
||||
}
|
||||
|
||||
}
|
||||
.num{
|
||||
font-size: 26rpx;
|
||||
color: #3EB2F5;
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,93 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="ranking">
|
||||
<view class="ranking-item" v-for="(content,index) in content" :key="index">
|
||||
<view class="name">{{content.name}}</view>
|
||||
<view class="progress" >
|
||||
<text :style="{backgroundImage:'linear-gradient(to top right,'+getColor(0,index)+','+getColor(1,index)+')',width:content.width + '%'}"></text>
|
||||
</view>
|
||||
<view class="num">{{content.num}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default{
|
||||
name:'ranking-list',
|
||||
props:{
|
||||
content:{
|
||||
type: Array,
|
||||
default() {
|
||||
return []
|
||||
}
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
init(){
|
||||
if(this.content && this.content.length >0){
|
||||
this.content = this.content.sort((a,b) => b.num - a.num);
|
||||
let max = this.content[0].num;
|
||||
this.content.map((item,index) =>{
|
||||
item.width = this.computeWidth(max,item.num);
|
||||
});
|
||||
this.$emit("updateRanking",this.content)
|
||||
}
|
||||
},
|
||||
computeWidth(max,current){
|
||||
let num = (current / max) * 100;
|
||||
return num.toFixed(2);
|
||||
},
|
||||
getColor(id,index){
|
||||
let color = "";
|
||||
switch(index){
|
||||
case 0:
|
||||
color = id == 0 ? "#fff":"#A80BFC";
|
||||
break;
|
||||
case 1:
|
||||
color = id == 0 ? "#fff":"#740CFF";
|
||||
break;
|
||||
case 2:
|
||||
color = id == 0 ? "#fff":"#4A08DC";
|
||||
break;
|
||||
default :
|
||||
color = id == 0 ? "#fff":"#1936DA";
|
||||
break;
|
||||
}
|
||||
return color;
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.init();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.ranking-item{
|
||||
display: flex;
|
||||
margin-bottom: 13rpx;
|
||||
padding: 10rpx;
|
||||
align-content: center;
|
||||
|
||||
.name{
|
||||
padding-right: 10rpx;
|
||||
color: #868688;
|
||||
}
|
||||
.progress{
|
||||
flex:5;
|
||||
text-align: left;
|
||||
padding-right: 10rpx;
|
||||
|
||||
text{
|
||||
display: inline-block;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
}
|
||||
.num{
|
||||
font-size: 26rpx;
|
||||
color: #3EB2F5;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,186 @@
|
||||
<template>
|
||||
<view class="text_block">
|
||||
<template v-for="(item,index) in content">
|
||||
<view v-if="item.kind == 1" :key="index" :style="{backgroundImage:'linear-gradient(to top right,'+item.background[0]+','+item.background[1]+')'}" :class="[(index+1)%3==0 ? '':'marginRight','kind','kind_one','breathe-blue']">
|
||||
<view class="view_100" :style="{fontSize:item.content[0].size,color:item.content[0].colorvalue}">{{item.content[0].value}}</view>
|
||||
<view class="view_100" :style="{fontSize:item.content[1].size,color:item.content[1].colortext}">{{item.content[1].text}}</view>
|
||||
</view>
|
||||
<view v-else-if="item.kind == 2" :key="index" :class="[(index+1)%3==0 ? '':'marginRight','kind','kind_two','breathe-blue']" :style="{backgroundImage:'linear-gradient(to top right,'+item.background[0]+','+item.background+')' ,marginRight:(index+1)%3==0?'0rpx':'40rpx'}">
|
||||
<view v-for="(content,i) in item.content" :key="i" class="two_1">
|
||||
<text :style="{fontSize:content.size,color:content.colortext}">{{content.text}}:</text>
|
||||
<text :style="{fontSize:content.size,color:content.colorvalue}">{{content.value}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else-if="item.kind == 3" :key="index" class="kind kind_three breathe-blue" :style="{backgroundImage:'linear-gradient(to top right,'+item.background[0]+','+item.background+')'}">
|
||||
<view class="view_100" :style="{fontSize:item.content[0].size,color:item.content[0].colorvalue}">{{item.content[0].value}}</view>
|
||||
<view class="view_100" :style="{fontSize:item.content[1].size,color:item.content[1].colortext}">{{item.content[1].text}}</view>
|
||||
<view class="three_3 view_100">
|
||||
<view v-for="(j,i) in 2" :key="i">
|
||||
<text :style="{fontSize:item.content[i+2].size,color:item.content[i+2].colortext}">{{item.content[i+2].text}}:</text>
|
||||
<text :style="{fontSize:item.content[i+2].size,color:item.content[i+2].colorvalue}">{{item.content[i+2].value}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else-if="item.kind == 4" :key="index" :class="[(index+1)%3==0 ? '':'marginRight','kind','kind_four','breathe-blue']" :style="{backgroundImage:'linear-gradient(to top right,'+item.background[0]+','+item.background[1]+')',marginRight:(index+1)%3==0?'0rpx':'40rpx'}">
|
||||
<view class="view_100" :style="{fontSize:item.content[0].size,color:item.content[0].colortext}">{{item.content[0].text}}</view>
|
||||
<view class="view_100" :style="{fontSize:item.content[1].size,color:item.content[1].colorvalue}">{{item.content[1].value}}</view>
|
||||
<view class="four_3" :style="{fontSize:item.content[2].size,color:item.content[2].colorvalue}">
|
||||
<text :style="{fontSize:item.content[3].size,color:item.content[3].colorvalue}">{{item.content[2].text}}</text>
|
||||
<li v-if="item.content[3].text == 'up'" class="iconfont icon-up icon" :style="{color:item.content[3].colortext}"></li>
|
||||
<li v-else class="iconfont icon-down icon" :style="{color:item.content[3].colortext}"></li>
|
||||
<text :style="{fontSize:item.content[3].size,color:item.content[3].colorvalue}">{{item.content[3].value}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else-if="item.kind == 5" :key="index" :class="[(index+1)%3==0 ? '':'marginRight','kind','kind_five','breathe-red']" :style="{backgroundImage:'linear-gradient(to top right,'+item.background[0]+','+item.background[1]+')',marginRight:(index+1)%3==0?'0rpx':'40rpx'}">
|
||||
<view class="view_100" :style="{fontSize:item.content[0].size,color:item.content[0].colortext}">{{item.content[0].text}}</view>
|
||||
<view class="view_100" :style="{fontSize:item.content[1].size,color:item.content[1].colorvalue}">{{item.content[1].value}}</view>
|
||||
<view class="five_3 view_100">
|
||||
<view v-for="(j,i) in 2" :key="i">
|
||||
<text :style="{fontSize:item.content[j+2].size,color:item.content[j+2].colortext}">{{item.content[j+2].text}}</text>
|
||||
<text :style="{fontSize:item.content[j+2].size,color:item.content[j+2].colorvalue}">{{item.content[j+2].value}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="five_4">
|
||||
<text :style="{fontSize:item.content[4].size,color:item.content[4].colortext}">{{item.content[4].text}}</text>
|
||||
<text :style="{fontSize:item.content[4].size,color:item.content[4].colorvalue}">{{item.content[4].value}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props:{
|
||||
content: {
|
||||
type: Array,
|
||||
default: []
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
},
|
||||
mounted() {
|
||||
uni.onWindowResize((res) => {
|
||||
console.log('变化后的窗口宽度=' + res.size.windowWidth)
|
||||
console.log('变化后的窗口高度=' + res.size.windowHeight)
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.text_block{
|
||||
display: flex;
|
||||
width: 100%;
|
||||
flex-wrap: wrap;
|
||||
.marginRight{
|
||||
margin-right: 36rpx!important;
|
||||
}
|
||||
.view_100{
|
||||
width: 100%;
|
||||
}
|
||||
.CPT_DYBG {
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
.kind{
|
||||
width: 24%;
|
||||
padding: 10rpx;
|
||||
margin-bottom: 40rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
border-radius: 16rpx;
|
||||
margin-left: 16rpx;
|
||||
box-shadow: -4px 4px 4px #ccc;
|
||||
position: relative;
|
||||
}
|
||||
.kind_one{
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
.kind_two{
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
.kind_three{
|
||||
border-radius: 16rpx;
|
||||
width: 300rpx;
|
||||
margin: 0 auto;
|
||||
.three_3{
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
}
|
||||
}
|
||||
.kind_four{
|
||||
border-radius: 10rpx;
|
||||
.four_3{
|
||||
display: flex;
|
||||
li {
|
||||
list-style-type:none;
|
||||
}
|
||||
.icon{
|
||||
margin-top: -8rpx;
|
||||
transform: scale(0.8);
|
||||
}
|
||||
}
|
||||
}
|
||||
.kind_five{
|
||||
border-radius: 20rpx;
|
||||
.five_3{
|
||||
view{
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// .breathe-blue {
|
||||
// position:relative;
|
||||
// color:#fff;
|
||||
// text-align:center;
|
||||
// cursor:pointer;
|
||||
// box-shadow:0 1px 2px rgba(0,0,0,.3);
|
||||
// overflow:hidden;
|
||||
// -webkit-animation-timing-function:ease-in-out;
|
||||
// -webkit-animation-name:breatheblue;
|
||||
// -webkit-animation-duration:2000ms;
|
||||
// -webkit-animation-iteration-count:infinite;
|
||||
// -webkit-animation-direction:alternate;
|
||||
// }
|
||||
// @keyframes breatheblue {
|
||||
// 0% {
|
||||
// opacity:.8;
|
||||
// box-shadow:0 1px 2px rgba(62,178,245,0.5);
|
||||
// }
|
||||
// 100% {
|
||||
// opacity:1;
|
||||
// box-shadow:0 1px 30px rgba(147,116,247,0.6);
|
||||
// }
|
||||
// }
|
||||
// .breathe-red {
|
||||
// position:relative;
|
||||
// color:#fff;
|
||||
// text-align:center;
|
||||
// cursor:pointer;
|
||||
// box-shadow:0 1px 2px rgba(0,0,0,.3);
|
||||
// overflow:hidden;
|
||||
// -webkit-animation-timing-function:ease-in-out;
|
||||
// -webkit-animation-name:breathered;
|
||||
// -webkit-animation-duration:2000ms;
|
||||
// -webkit-animation-iteration-count:infinite;
|
||||
// -webkit-animation-direction:alternate;
|
||||
// }
|
||||
// @keyframes breathered {
|
||||
// 0% {
|
||||
// opacity:.8;
|
||||
// box-shadow:0 1px 2px rgba(247,126,137,0.5);
|
||||
// }
|
||||
// 100% {
|
||||
// opacity:1;
|
||||
// box-shadow:0 1px 30px rgba(247,149,59,0.9);
|
||||
// }
|
||||
// }
|
||||
</style>
|
||||
@ -0,0 +1,170 @@
|
||||
<template>
|
||||
<view class="uni-calendar-item__weeks-box" :class="{
|
||||
'uni-calendar-item--disable':weeks.disable,
|
||||
'uni-calendar-item--isDay':calendar.fullDate === weeks.fullDate && weeks.isDay,
|
||||
'uni-calendar-item--checked':(calendar.fullDate === weeks.fullDate && !weeks.isDay) ,
|
||||
'uni-calendar-item--before-checked':weeks.beforeMultiple,
|
||||
'uni-calendar-item--multiple': weeks.multiple,
|
||||
'uni-calendar-item--after-checked':weeks.afterMultiple,
|
||||
}"
|
||||
@click="choiceDate(weeks)">
|
||||
<view class="uni-calendar-item__weeks-box-item">
|
||||
<text v-if="selected&&weeks.extraInfo" class="uni-calendar-item__weeks-box-circle"></text>
|
||||
<text class="uni-calendar-item__weeks-box-text" :class="{
|
||||
'uni-calendar-item--isDay-text': weeks.isDay,
|
||||
'uni-calendar-item--isDay':calendar.fullDate === weeks.fullDate && weeks.isDay,
|
||||
'uni-calendar-item--checked':calendar.fullDate === weeks.fullDate && !weeks.isDay,
|
||||
'uni-calendar-item--before-checked':weeks.beforeMultiple,
|
||||
'uni-calendar-item--multiple': weeks.multiple,
|
||||
'uni-calendar-item--after-checked':weeks.afterMultiple,
|
||||
'uni-calendar-item--disable':weeks.disable,
|
||||
}">{{weeks.date}}</text>
|
||||
<text v-if="!lunar&&!weeks.extraInfo && weeks.isDay" class="uni-calendar-item__weeks-lunar-text" :class="{
|
||||
'uni-calendar-item--isDay-text':weeks.isDay,
|
||||
'uni-calendar-item--isDay':calendar.fullDate === weeks.fullDate && weeks.isDay,
|
||||
'uni-calendar-item--checked':calendar.fullDate === weeks.fullDate && !weeks.isDay,
|
||||
'uni-calendar-item--before-checked':weeks.beforeMultiple,
|
||||
'uni-calendar-item--multiple': weeks.multiple,
|
||||
'uni-calendar-item--after-checked':weeks.afterMultiple,
|
||||
}">今天</text>
|
||||
<text v-if="lunar&&!weeks.extraInfo" class="uni-calendar-item__weeks-lunar-text" :class="{
|
||||
'uni-calendar-item--isDay-text':weeks.isDay,
|
||||
'uni-calendar-item--isDay':calendar.fullDate === weeks.fullDate && weeks.isDay,
|
||||
'uni-calendar-item--checked':calendar.fullDate === weeks.fullDate && !weeks.isDay,
|
||||
'uni-calendar-item--before-checked':weeks.beforeMultiple,
|
||||
'uni-calendar-item--multiple': weeks.multiple,
|
||||
'uni-calendar-item--after-checked':weeks.afterMultiple,
|
||||
'uni-calendar-item--disable':weeks.disable,
|
||||
}">{{weeks.isDay?'今天': (weeks.lunar.IDayCn === '初一'?weeks.lunar.IMonthCn:weeks.lunar.IDayCn)}}</text>
|
||||
<text v-if="weeks.extraInfo&&weeks.extraInfo.info" class="uni-calendar-item__weeks-lunar-text" :class="{
|
||||
'uni-calendar-item--extra':weeks.extraInfo.info,
|
||||
'uni-calendar-item--isDay-text':weeks.isDay,
|
||||
'uni-calendar-item--isDay':calendar.fullDate === weeks.fullDate && weeks.isDay,
|
||||
'uni-calendar-item--checked':calendar.fullDate === weeks.fullDate && !weeks.isDay,
|
||||
'uni-calendar-item--before-checked':weeks.beforeMultiple,
|
||||
'uni-calendar-item--multiple': weeks.multiple,
|
||||
'uni-calendar-item--after-checked':weeks.afterMultiple,
|
||||
'uni-calendar-item--disable':weeks.disable,
|
||||
}">{{weeks.extraInfo.info}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
weeks: {
|
||||
type: Object,
|
||||
default () {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
calendar: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
selected: {
|
||||
type: Array,
|
||||
default: () => {
|
||||
return []
|
||||
}
|
||||
},
|
||||
lunar: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
choiceDate(weeks) {
|
||||
this.$emit('change', weeks)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.uni-calendar-item__weeks-box {
|
||||
flex: 1;
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.uni-calendar-item__weeks-box-text {
|
||||
font-size: $uni-font-size-base;
|
||||
color: $uni-text-color;
|
||||
}
|
||||
|
||||
.uni-calendar-item__weeks-lunar-text {
|
||||
font-size: $uni-font-size-sm;
|
||||
color: $uni-text-color;
|
||||
}
|
||||
|
||||
.uni-calendar-item__weeks-box-item {
|
||||
position: relative;
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
}
|
||||
|
||||
.uni-calendar-item__weeks-box-circle {
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
right: 5px;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 8px;
|
||||
background-color: $uni-color-error;
|
||||
|
||||
}
|
||||
|
||||
.uni-calendar-item--disable {
|
||||
background-color: rgba(249, 249, 249, $uni-opacity-disabled);
|
||||
color: $uni-text-color-disable;
|
||||
}
|
||||
|
||||
.uni-calendar-item--isDay-text {
|
||||
color: $uni-color-primary;
|
||||
}
|
||||
|
||||
.uni-calendar-item--isDay {
|
||||
background-color: $uni-color-primary;
|
||||
opacity: 0.8;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.uni-calendar-item--extra {
|
||||
color: $uni-color-error;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.uni-calendar-item--checked {
|
||||
background-color: $uni-color-primary;
|
||||
color: #fff;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.uni-calendar-item--multiple {
|
||||
background-color: $uni-color-primary;
|
||||
color: #fff;
|
||||
opacity: 0.8;
|
||||
}
|
||||
.uni-calendar-item--before-checked {
|
||||
background-color: #ff5a5f;
|
||||
color: #fff;
|
||||
}
|
||||
.uni-calendar-item--after-checked {
|
||||
background-color: #ff5a5f;
|
||||
color: #fff;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,134 @@
|
||||
<template>
|
||||
<scroll-view class="wuc-tab" :class="tabClass" :style="tabStyle" scroll-with-animation scroll-x :scroll-left="scrollLeft">
|
||||
<div v-if="!textFlex">
|
||||
<div class="wuc-tab-item" :class="[index === tabCur ? selectClass + ' cur':'']" v-for="(item,index) in tabList" :key="index" :id="index" @tap="tabSelect(index,$event)">
|
||||
<text :class="item.icon"></text>
|
||||
<span>{{item.name}}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex text-center" v-if="textFlex">
|
||||
<div class="wuc-tab-item flex-sub" :class="index === tabCur ? selectClass + ' cur':''" v-for="(item,index) in tabList" :key="index" :id="index" @tap="tabSelect(index,$event)">
|
||||
<text :class="item.icon"></text>
|
||||
<span>{{item.name}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</scroll-view>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: 'wuc-tab',
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
props: {
|
||||
tabList: {
|
||||
type: Array,
|
||||
default() {
|
||||
return [];
|
||||
}
|
||||
},
|
||||
tabCur: {
|
||||
type: Number,
|
||||
default() {
|
||||
return 0;
|
||||
}
|
||||
},
|
||||
tabClass: {
|
||||
type: String,
|
||||
default() {
|
||||
return '';
|
||||
}
|
||||
},
|
||||
tabStyle: {
|
||||
type: String,
|
||||
default() {
|
||||
return '';
|
||||
}
|
||||
},
|
||||
textFlex: {
|
||||
type: Boolean,
|
||||
default() {
|
||||
return false;
|
||||
}
|
||||
},
|
||||
selectClass: {
|
||||
type: String,
|
||||
default() {
|
||||
return 'text-blue';
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
tabSelect(index, e) {
|
||||
if (this.currentTab === index) return false;
|
||||
this.$emit('update:tabCur', index);
|
||||
this.$emit('changeTab', this.tabList[index]);
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
scrollLeft() {
|
||||
return (this.tabCur - 1) * 60;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
div,
|
||||
scroll-view,
|
||||
swiper {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.wuc-tab {
|
||||
white-space: nowrap;
|
||||
}
|
||||
.wuc-tab-item {
|
||||
height: 90rpx;
|
||||
display: inline-block;
|
||||
line-height: 90rpx;
|
||||
margin: 0 10upx;
|
||||
padding: 0 20upx;
|
||||
}
|
||||
|
||||
.wuc-tab-item.cur {
|
||||
color: #40A2ED;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.wuc-tab.fixed {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
top: 0;
|
||||
z-index: 1024;
|
||||
box-shadow: 0 1upx 6upx rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.flex {
|
||||
display: flex;
|
||||
}
|
||||
.text-center {
|
||||
text-align: center;
|
||||
}
|
||||
.flex-sub {
|
||||
flex: 1;
|
||||
}
|
||||
.text-blue{
|
||||
color:#40A2ED;
|
||||
}
|
||||
.text-white{
|
||||
color:#ffffff;
|
||||
}
|
||||
.bg-white{
|
||||
background-color: #ffffff;
|
||||
}
|
||||
.bg-blue{
|
||||
background-color: #40A2ED;
|
||||
}
|
||||
.text-orange{
|
||||
color: #f37b1d
|
||||
}
|
||||
|
||||
.text-xl {
|
||||
font-size: 36upx;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,582 @@
|
||||
<template>
|
||||
<view class="body">
|
||||
<!-- <view class="topLine" :style="{height: topBar+'px'}"></view> -->
|
||||
<view class="nav row_align_center" id="nav">
|
||||
<li style="color: #fff;z-index: 999;" :class="['iconfont icon-zuojiantou back']" @click="gotoBack()"></li>
|
||||
</view>
|
||||
<view class="top_head">
|
||||
<view class="text_des">
|
||||
<text class="month_num">{{ nowTime.month }}</text>
|
||||
<text class="month_text">月</text>
|
||||
<text class="month_year">{{ nowTime.year }}</text>
|
||||
<text class="point">.</text>
|
||||
<text class="title">财务报告</text>
|
||||
</view>
|
||||
<view class="top_desc">
|
||||
<view class="text-gray">结余</view>
|
||||
<view class="remaining">{{ myWallet.remaining }}</view>
|
||||
<view class="row head_block">
|
||||
<view class="flex_1">
|
||||
<text class="text-gray">支出</text>
|
||||
<text class="text_green">{{ myWallet.expend }}</text>
|
||||
</view>
|
||||
<view class="flex_1">
|
||||
<text class="text-gray">收入</text>
|
||||
<text class="income">{{ myWallet.income }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="main">
|
||||
<view class="row_block">
|
||||
<view class="the_title" style="justify-content: space-between;">
|
||||
<view class="left_title">
|
||||
<view class="title_icon"></view>
|
||||
<text class="margin_stand-samll font-big wide">历史趋势</text>
|
||||
</view>
|
||||
<view class="right_btn">
|
||||
<view v-for="(item, index) in historyBtn" :key="index" :class="item.state ? 'active_btn' : ''"
|
||||
@click="changeHistoryBtn(item.type)">{{ item.name }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="charts-box" style="height: 200px;">
|
||||
<qiun-data-charts type="line" canvasId="finance_a" :canvas2d="isCanvas2d" :resshow="delayload"
|
||||
:opts="{ xAxis: { itemCount: 12, disableGrid: true }, yAxis: { disableGrid: true, data: [{ disabled: true }] } }"
|
||||
:chartData="historyData" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="row_block">
|
||||
<view class="the_title">
|
||||
<view class="title_icon"></view>
|
||||
<text class="margin_stand-samll font-big wide">钱都去哪了</text>
|
||||
</view>
|
||||
<view v-if="delayload" class="charts-box">
|
||||
<qiun-data-charts type="ring" canvasId="finance_b" :canvas2d="isCanvas2d" :resshow="delayload"
|
||||
:opts="{ padding: [15, 0, 4, 0], legend: { position: 'bottom' }, title: { name: expendCount }, subtitle: { name: '支出', fontSize: '20' } }"
|
||||
:chartData="expendDetail" />
|
||||
</view>
|
||||
<view class="the_title">
|
||||
<text class="margin_stand-samll font-middle wide">支出单笔最贵</text>
|
||||
</view>
|
||||
<view class="extend_rank">
|
||||
<view class="rank_item" v-for="(item, index) in extendRank" :key="index">
|
||||
<image :src="getImage(index)" mode="widthFix"></image>
|
||||
<text class="name">{{ item.name }}</text>
|
||||
<text class="desc">{{ item.desc }}</text>
|
||||
<text class="text_green money">{{ item.money }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="row_block">
|
||||
<view class="the_title">
|
||||
<view class="title_icon"></view>
|
||||
<text class="margin_stand-samll font-big wide">{{ nowTime.month }}月明细</text>
|
||||
</view>
|
||||
<view class="detail_list">
|
||||
<view v-for="(item, index) in detail_list" :key="index" class="detail_item">
|
||||
<view>
|
||||
<view class="font-middle">{{ item.date }}</view>
|
||||
<view class="font-small">{{ item.time }}</view>
|
||||
</view>
|
||||
<view class="icon">
|
||||
<li :class="['iconfont', item.type == 'income' ? 'icon-income' : 'icon-expend']"></li>
|
||||
</view>
|
||||
<view class="right_content">
|
||||
<view class="money">{{ item.type == 'income' ? '+' : '-' }}{{ item.money }}</view>
|
||||
<view class="text-gray font-middle">{{ item.desc }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="end_block">
|
||||
<view class="the_title" style="margin-bottom: 40rpx;">
|
||||
<view class="title_icon"></view>
|
||||
<text class="margin_stand-samll font-big wide">我的支出水平</text>
|
||||
</view>
|
||||
<view class="level_bar">
|
||||
<view v-for="(item, index) in extend_level_bar" :key="index" :style="{ width: item.width }"
|
||||
:class="item.state ? 'text_green font-middle' : ''">{{ item.name }}</view>
|
||||
</view>
|
||||
<view class="level_bar">
|
||||
<view v-for="(item, index) in extend_level_bar" :key="index" :style="{ width: item.width }"
|
||||
:class="item.state ? 'active_bar' : 'default_bar'"></view>
|
||||
</view>
|
||||
<view class="level_bar">
|
||||
<view v-for="(item, index) in extend_level_bar" :key="index" :style="{ width: item.width }"
|
||||
:class="item.state ? 'text_green font-middle' : ''">{{ item.range }}</view>
|
||||
</view>
|
||||
<view class="extend_message">
|
||||
<li style="color: #ccc;" :class="['iconfont icon-message']"></li>
|
||||
<view>
|
||||
“ 我的支出水平已超过
|
||||
<text>{{ extend_morethan }}</text>
|
||||
的乡镇居民。 ”
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ProgressBar from "../../components/progress-bar/progress-bar.vue"
|
||||
import dataOne from '../../static/json/finance/1.json';
|
||||
import expendDetail from '../../static/json/finance/2.json';
|
||||
let _now = new Date();
|
||||
let now_time = {};
|
||||
now_time.year = _now.getFullYear()
|
||||
now_time.month = _now.getMonth() + 1
|
||||
now_time.day = _now.getDay()
|
||||
export default {
|
||||
components: {
|
||||
ProgressBar
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
info: '大便超人', //用户数据
|
||||
scrollHeight: "600px", //数据展示体高度
|
||||
isCanvas2d: this.$Config.ISCANVAS2D,
|
||||
historyData: {},
|
||||
dataOne,
|
||||
expendDetail,
|
||||
expendCount: 0,
|
||||
delayload: false,
|
||||
nowTime: {
|
||||
year: now_time.year,
|
||||
month: now_time.month,
|
||||
day: now_time.day
|
||||
},
|
||||
historyBtn: [{
|
||||
name: "支出",
|
||||
state: 1,
|
||||
type: "expend"
|
||||
},
|
||||
{
|
||||
name: "收入",
|
||||
state: 0,
|
||||
type: "income"
|
||||
},
|
||||
{
|
||||
name: "结余",
|
||||
state: 0,
|
||||
type: "remaining"
|
||||
},
|
||||
],
|
||||
myWallet: {
|
||||
remaining: 3000.34,
|
||||
expend: 5240.32,
|
||||
income: 8240.66
|
||||
},
|
||||
extendRank: [{
|
||||
name: "腐败聚会",
|
||||
desc: now_time.month + "月6日12:34-跨界空间轰趴",
|
||||
money: "422.12"
|
||||
},
|
||||
{
|
||||
name: "沐浴按摩",
|
||||
desc: now_time.month + "月12日21:34-乔杉沐浴城",
|
||||
money: "318.00"
|
||||
},
|
||||
{
|
||||
name: "食品酒水",
|
||||
desc: now_time.month + "月1日21:34-school酒馆",
|
||||
money: "289.50"
|
||||
},
|
||||
],
|
||||
extend_level_bar: [
|
||||
{ name: "低消费", range: "<2000元", width: "20%" },
|
||||
{ name: "中间消费", range: "2000-5000元", width: "35%" },
|
||||
{ name: "较高消费", range: "5000-8000元", width: "25%", state: 1 },
|
||||
{ name: "高消费", range: ">8000元", width: "20%" },
|
||||
],
|
||||
extend_morethan: "68%",
|
||||
detail_list: [
|
||||
{ date: now_time.month + "-01", time: "11:01", "type": "extend", money: "10.00", desc: "银行卡转出" },
|
||||
{ date: now_time.month + "-01", time: "13:45", "type": "income", money: "18.00", desc: "银行卡收入" },
|
||||
{ date: now_time.month + "-02", time: "06:21", "type": "extend", money: "123.45", desc: "信用卡转出" },
|
||||
{ date: now_time.month + "-03", time: "07:38", "type": "income", money: "23.00", desc: "银行卡收入" },
|
||||
{ date: now_time.month + "-08", time: "16:28", "type": "extend", money: "23.56", desc: "信用卡转出" },
|
||||
{ date: now_time.month + "-09", time: "15:25", "type": "income", money: "850.12", desc: "银行卡收入" },
|
||||
{ date: now_time.month + "-09", time: "18:52", "type": "income", money: "1.88", desc: "银行卡收入" },
|
||||
{ date: now_time.month + "-11", time: "21:12", "type": "extend", money: "220.21", desc: "银行卡转出" },
|
||||
{ date: now_time.month + "-12", time: "13:08", "type": "income", money: "32.28", desc: "银行卡收入" },
|
||||
{ date: now_time.month + "-12", time: "12:41", "type": "extend", money: "122.12", desc: "信用卡转出" },
|
||||
{ date: now_time.month + "-13", time: "17:21", "type": "income", money: "10.00", desc: "银行卡收入" },
|
||||
]
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
"historyBtn": {
|
||||
deep: true,
|
||||
handler: function (newVal, oldVal) {
|
||||
this.filterHistoryData();
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async getData() {
|
||||
uni.showLoading();
|
||||
this.filterHistoryData();
|
||||
for (let i = 0; i < this.expendDetail.series.length; i++) {
|
||||
this.expendDetail.series[i].format = "pieDemo"
|
||||
}
|
||||
let length = this.expendDetail.series[0].data.length
|
||||
for (let i = 0; i < length; i++) {
|
||||
this.expendCount += this.expendDetail.series[0].data[i].value
|
||||
}
|
||||
await setTimeout(() => {
|
||||
this.delayload = true;
|
||||
uni.hideLoading();
|
||||
}, 1000)
|
||||
},
|
||||
changeHistoryBtn(type) {
|
||||
for (let i = 0; i < this.historyBtn.length; i++) {
|
||||
if (this.historyBtn[i].type == type) {
|
||||
this.historyBtn[i].state = 1
|
||||
} else {
|
||||
this.historyBtn[i].state = 0
|
||||
}
|
||||
}
|
||||
},
|
||||
filterHistoryData() {
|
||||
let type = this.historyBtn.filter(x => x.state == 1)[0].type;
|
||||
switch (type) {
|
||||
case "expend":
|
||||
this.historyData = this.dataOne.expend;
|
||||
break;
|
||||
case "income":
|
||||
this.historyData = this.dataOne.income;
|
||||
break;
|
||||
case "remaining":
|
||||
this.historyData = this.dataOne.remaining;
|
||||
break;
|
||||
}
|
||||
},
|
||||
gotoBack() {
|
||||
this.$Common.navigateBack("/index/index");
|
||||
},
|
||||
getImage(index) {
|
||||
switch (index) {
|
||||
case 0:
|
||||
return "https://s1.ax1x.com/2023/03/31/ppRYrfP.png";
|
||||
break;
|
||||
case 1:
|
||||
return "https://s1.ax1x.com/2023/03/31/ppRYySf.png";
|
||||
break;
|
||||
case 2:
|
||||
return "https://s1.ax1x.com/2023/03/31/ppRY6l8.png";
|
||||
break;
|
||||
}
|
||||
}
|
||||
},
|
||||
onReady() {
|
||||
//#ifndef H5
|
||||
uni.showShareMenu();
|
||||
//#endif
|
||||
this.getData()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.body {
|
||||
height: 100%;
|
||||
background-color: #560594;
|
||||
margin: 0;
|
||||
padding-bottom: 20rpx;
|
||||
|
||||
li {
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.nav {
|
||||
position: fixed;
|
||||
top: 50rpx;
|
||||
left: 20rpx;
|
||||
}
|
||||
|
||||
.text_green {
|
||||
color: #4ECDB6;
|
||||
}
|
||||
|
||||
.main {
|
||||
width: 100%;
|
||||
padding: 0 10rpx;
|
||||
box-sizing: border-box;
|
||||
margin-top: 20rpx;
|
||||
|
||||
.detail_list {
|
||||
height: 700rpx;
|
||||
overflow: auto;
|
||||
color: #9E9E9E;
|
||||
|
||||
.detail_item {
|
||||
display: flex;
|
||||
margin: 20rpx 0;
|
||||
align-items: center;
|
||||
|
||||
.icon {
|
||||
width: 30%;
|
||||
text-align: center;
|
||||
|
||||
li {
|
||||
font-size: 80rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.right_content {
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.icon-income {
|
||||
color: #4AABF9;
|
||||
}
|
||||
|
||||
.icon-expend {
|
||||
color: #E45521;
|
||||
}
|
||||
|
||||
.money {
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.extend_message {
|
||||
margin-top: 20rpx;
|
||||
color: #ccc;
|
||||
display: flex;
|
||||
|
||||
text {
|
||||
color: #ff9900;
|
||||
}
|
||||
}
|
||||
|
||||
.level_bar {
|
||||
width: 100%;
|
||||
height: 40rpx;
|
||||
border-radius: 40rpx;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
color: #ccc;
|
||||
font-size: 20rpx;
|
||||
text-align: right;
|
||||
line-height: 40rpx;
|
||||
|
||||
view {
|
||||
border-right: 2rpx solid #fff;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.name {
|
||||
position: absolute;
|
||||
top: -30rpx;
|
||||
right: -40rpx;
|
||||
}
|
||||
|
||||
.range {
|
||||
position: absolute;
|
||||
bottom: 30rpx;
|
||||
right: -40rpx;
|
||||
}
|
||||
|
||||
.default_bar {
|
||||
background-color: #A0DFCD;
|
||||
}
|
||||
|
||||
.active_bar {
|
||||
background-color: #02AE7A;
|
||||
}
|
||||
}
|
||||
|
||||
.right_btn {
|
||||
float: right;
|
||||
display: flex;
|
||||
color: #ccc;
|
||||
font-size: 22rpx;
|
||||
|
||||
view {
|
||||
line-height: 50rpx;
|
||||
height: 50rpx;
|
||||
margin: 0 20rpx;
|
||||
}
|
||||
|
||||
.active_btn {
|
||||
padding: 0rpx 20rpx;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 40rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.end_block {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
border-radius: 12rpx;
|
||||
position: relative;
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
.row_block {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
border-radius: 12rpx;
|
||||
position: relative;
|
||||
padding: 20rpx;
|
||||
|
||||
&::after {
|
||||
content: "";
|
||||
height: 0px;
|
||||
width: 92%;
|
||||
position: absolute;
|
||||
transform: translateX(-50%);
|
||||
left: 50%;
|
||||
bottom: 0;
|
||||
border-top: 1px dashed #ccc;
|
||||
}
|
||||
}
|
||||
|
||||
.the_title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.left_title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.title_icon {
|
||||
background-color: #7E7E7E;
|
||||
height: 40rpx;
|
||||
width: 10rpx;
|
||||
border-radius: 10rpx;
|
||||
margin-right: 20rpx;
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
.extend_rank {
|
||||
width: 100%;
|
||||
background-color: #F5F5F5;
|
||||
box-sizing: border-box;
|
||||
padding: 10rpx;
|
||||
|
||||
.rank_item {
|
||||
width: 100%;
|
||||
margin: 20rpx 0;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
font-size: 26rpx;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
width: 10%;
|
||||
}
|
||||
|
||||
text {
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.name {
|
||||
margin: 0 10rpx;
|
||||
color: #7D7D7D;
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
.desc {
|
||||
width: 50%;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.money {
|
||||
width: 20%;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.top_head {
|
||||
height: 435rpx;
|
||||
width: 100%;
|
||||
padding: 110rpx 10rpx 0rpx 10rpx;
|
||||
background: url("https://img1.qunarzz.com/travel/d3/1704/db/34de73c353d44db5.jpg_r_640x426x70_53f464ca.jpg") no-repeat center 0px;
|
||||
background-size: 100% 100%;
|
||||
box-sizing: border-box;
|
||||
|
||||
.top_desc {
|
||||
width: 100%;
|
||||
border-radius: 20rpx;
|
||||
background-color: #fff;
|
||||
margin-top: 20rpx;
|
||||
padding: 20rpx;
|
||||
box-sizing: border-box;
|
||||
|
||||
.text-gray {
|
||||
font-size: 28rpx;
|
||||
color: #ccc;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.remaining {
|
||||
font-size: 46rpx;
|
||||
}
|
||||
|
||||
.flex_1 {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.head_block {
|
||||
margin-top: 20rpx;
|
||||
|
||||
.income {
|
||||
color: #E34B5E;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.text_des {
|
||||
height: 100rpx;
|
||||
color: #fff;
|
||||
font-weight: 900;
|
||||
position: relative;
|
||||
margin-left: 60rpx;
|
||||
|
||||
text {
|
||||
display: inline-block;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.month_num {
|
||||
font-size: 90rpx;
|
||||
}
|
||||
|
||||
.month_text {
|
||||
font-size: 56rpx;
|
||||
}
|
||||
|
||||
.month_year {
|
||||
font-size: 22rpx;
|
||||
position: absolute;
|
||||
left: 60rpx;
|
||||
top: 20rpx;
|
||||
}
|
||||
|
||||
.point {
|
||||
font-size: 40rpx;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 40rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,760 @@
|
||||
<template>
|
||||
<view class="body">
|
||||
<view class="nav row_align_center" id="nav">
|
||||
<li style="z-index: 999;font-size: 50rpx;" :class="['iconfont icon-zuojiantou back']" @click="gotoBack()">
|
||||
</li>
|
||||
</view>
|
||||
<view class="head">
|
||||
<view class="title">运动报告</view>
|
||||
<view class="customer_img">
|
||||
<!-- <open-data type="userAvatarUrl" class="img"></open-data> -->
|
||||
<image class="img" src="https://s1.ax1x.com/2022/11/16/zZUoK1.jpg" mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="score_view">
|
||||
<view class="title">本次评分</view>
|
||||
<view class="detail">
|
||||
<view class="socre">98</view>
|
||||
<li :class="['iconfont icon-up text-green']" @click="gotoBack()"></li>
|
||||
<view class="up_socre">0.4</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="census_view">
|
||||
<view class="left">
|
||||
<view class="text_gray small_text">消耗(千卡)</view>
|
||||
<view class="middle_text text_wide_900">165</view>
|
||||
</view>
|
||||
<view class="right">
|
||||
<view class="text_gray small_text">心率主要集中在</view>
|
||||
<view style="font-size: 30rpx;">燃烧脂肪</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="census_view">
|
||||
<view class="left">
|
||||
<view class="text_gray small_text">时长(分钟)</view>
|
||||
<view class="middle_text text_wide_900">75</view>
|
||||
</view>
|
||||
<view class="center">
|
||||
<view class="text_gray small_text">累计打卡(天)</view>
|
||||
<view class="middle_text text_wide_900">24</view>
|
||||
</view>
|
||||
<view class="right">
|
||||
<view class="text_gray small_text">平均心率(次/分钟)</view>
|
||||
<view class="middle_text text_wide_900">98</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="consume_view">
|
||||
<view class="wrap"><span class="consume_tip">身体消耗</span></view>
|
||||
<li :class="['iconfont icon-niunai consume_icon']"></li>
|
||||
<view class="desc">
|
||||
<view class="small_text">约消耗</view>
|
||||
<view class="text_wide_900"><text class="left">1000</text><text class="right">毫升牛奶</text></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="heart_rate_view">
|
||||
<view class="left">
|
||||
<li :class="['iconfont icon-zhexiantu']"></li>
|
||||
<text class="title">心率变化曲线</text>
|
||||
</view>
|
||||
<view class="right text_gray">心率变化</view>
|
||||
</view>
|
||||
<view v-if="heartRateData.series" class="heart_rate_chart">
|
||||
<view class="charts-box">
|
||||
<qiun-data-charts type="tline" canvasId="sport_a" :canvas2d="isCanvas2d" :resshow="delayload"
|
||||
:opts="{ padding: [0, 20, 10, 0], legend: { position: 'top', lineHeight: 20 }, xAxis: { disableGrid: true, format: 'xAxisDemo3' }, yAxis: { data: [{ min: 0, max: 175 }], gridType: 'solid' }, dataLabel: false, dataPointShape: false }"
|
||||
:chartData="heartRateData" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="title_view">
|
||||
<view class="left">
|
||||
<li :class="['iconfont icon-xinlv']"></li>
|
||||
<text class="title">心率区间</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="heart_rate_range">
|
||||
<view class="top">
|
||||
<view class="item" v-for="(item, index) in heatRateRange" :key="index">
|
||||
<view class="name text_gray">{{ item.name }}</view>
|
||||
<view class="data">{{ item.type }}{{ item.data }}<text class="unit text_gray">分钟</text></view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="heartRateRangeData" class="charts-box">
|
||||
<qiun-data-charts type="ring" canvasId="sport_b" :canvas2d="isCanvas2d" :resshow="delayload"
|
||||
:opts="{ legend: { position: 'bottom' }, extra: { ring: { border: false, centerColor: '#312C34' } }, title: { name: '' }, subtitle: { name: '' } }"
|
||||
:chartData="heartRateRangeData" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="title_view">
|
||||
<view class="left">
|
||||
<li :class="['iconfont icon-pie']"></li>
|
||||
<text class="title">运动分析</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="sport_analysis_view">
|
||||
<view class="top">
|
||||
<li class="iconfont icon-feiji"></li>
|
||||
<text class="title font-s-34">跑步机</text>
|
||||
</view>
|
||||
<view class="middle">
|
||||
<view class="left">
|
||||
<li class="iconfont icon-clock"></li>
|
||||
<view>3.24P.M</view>
|
||||
</view>
|
||||
<view class="right">
|
||||
<li class="iconfont icon-huo"></li>
|
||||
<view>热量消耗(千卡)</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom">
|
||||
<view class="left">
|
||||
<li class="iconfont icon-kongxinyuan"></li>
|
||||
<view>燃烧脂肪</view>
|
||||
</view>
|
||||
<view class="right">
|
||||
<view class="text_wide_600 font-s-40">637</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="box_view speed_rank_view">
|
||||
<view class="top">
|
||||
<view class="item" v-for="(item, index) in speedRank" :key="index">
|
||||
<view class="name text_gray">{{ item.name }}</view>
|
||||
<view class="data">{{ item.data }}<text class="unit text_gray">{{ item.unit }}</text></view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="speedRankData" class="charts-box">
|
||||
<qiun-data-charts type="bar" canvasId="sport_c" :canvas2d="isCanvas2d" :resshow="delayload"
|
||||
:chartData="speedRankData" background="none"
|
||||
:opts="{ xAxis: { disabled: true, disableGrid: true }, extra: { bar: { barBorderCircle: true, width: 20 } }, legend: { show: false } }" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="box_view">
|
||||
<view v-if="speedAndRateData.series" class="charts-box">
|
||||
<qiun-data-charts type="tline" canvasId="sport_d" :canvas2d="isCanvas2d" :resshow="delayload"
|
||||
:opts="{ padding: [0, 20, 10, 0], legend: { position: 'top', lineHeight: 20 }, xAxis: { disableGrid: true, format: 'xAxisDemo3' }, yAxis: { data: [{ position: 'left', min: 0, max: 25 }, { position: 'right', min: 50, max: 175 }], gridType: 'solid' }, dataLabel: false, dataPointShape: false }"
|
||||
:chartData="speedAndRateData" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import heartRateData from "../../static/json/sport/1.json"
|
||||
import heartRateRangeData from "../../static/json/sport/2.json"
|
||||
import speedRankData from "../../static/json/sport/3.json"
|
||||
import speedAndRateData from "../../static/json/sport/4.json"
|
||||
|
||||
export default {
|
||||
components: {
|
||||
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
info: '大便超人', //用户数据
|
||||
isCanvas2d: this.$Config.ISCANVAS2D,
|
||||
heartRateData: {},
|
||||
speedRankData: {},
|
||||
speedAndRateData: {},
|
||||
delayload: null,
|
||||
heartRateRangeData: {},
|
||||
heatRateRange: [{
|
||||
name: "激活放松",
|
||||
data: "5",
|
||||
type: "≤"
|
||||
},
|
||||
{
|
||||
name: "动态热身",
|
||||
data: "13",
|
||||
type: ""
|
||||
},
|
||||
{
|
||||
name: "脂肪燃烧",
|
||||
data: "24",
|
||||
type: ""
|
||||
},
|
||||
{
|
||||
name: "糖分消耗",
|
||||
data: "8",
|
||||
type: "≤"
|
||||
},
|
||||
{
|
||||
name: "心肺训练",
|
||||
data: "7",
|
||||
type: ""
|
||||
},
|
||||
{
|
||||
name: "极限锻炼",
|
||||
data: "16",
|
||||
type: ""
|
||||
},
|
||||
],
|
||||
speedRank: [{
|
||||
name: "距离",
|
||||
data: "5",
|
||||
unit: "公里"
|
||||
},
|
||||
{
|
||||
name: "时长",
|
||||
data: "12",
|
||||
unit: "分钟"
|
||||
},
|
||||
{
|
||||
name: "平均配速",
|
||||
data: "6\'05\"",
|
||||
unit: ""
|
||||
}
|
||||
]
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
async getData() {
|
||||
uni.showLoading();
|
||||
/*将钟点时间随机转成某一天的具体时间戳*/
|
||||
if (typeof heartRateData.series[0].data[0][0] == 'string') {
|
||||
for (let i = 0; i < heartRateData.series.length; i++) {
|
||||
heartRateData.series[i].data.map(x => {
|
||||
x[0] = "2018/08/08 " + x[0];
|
||||
x[0] = this.tranTimestamp(x[0]);
|
||||
return x[0];
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
if (typeof speedAndRateData.series[0].data[0][0] == 'string') {
|
||||
for (let i = 0; i < speedAndRateData.series.length; i++) {
|
||||
speedAndRateData.series[i].data.map(x => {
|
||||
x[0] = "2018/08/08 " + x[0];
|
||||
x[0] = this.tranTimestamp(x[0]);
|
||||
return x[0];
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
this.heartRateData = heartRateData;
|
||||
this.heartRateRangeData = heartRateRangeData;
|
||||
this.speedRankData = speedRankData;
|
||||
this.speedAndRateData = speedAndRateData;
|
||||
this.delayload = true;
|
||||
uni.hideLoading();
|
||||
},
|
||||
tranTimestamp(date) {
|
||||
return new Date(date).getTime()
|
||||
},
|
||||
gotoBack() {
|
||||
this.$Common.navigateBack("/index/index");
|
||||
},
|
||||
|
||||
},
|
||||
onReady() {
|
||||
//#ifndef H5
|
||||
uni.showShareMenu();
|
||||
//#endif
|
||||
this.getData()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.body {
|
||||
height: 100%;
|
||||
background-color: #1C191F;
|
||||
margin: 0;
|
||||
color: #fff;
|
||||
padding: 80rpx 20rpx 0 20rpx;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding-bottom: 50rpx;
|
||||
|
||||
.box_view {
|
||||
width: 100%;
|
||||
padding: 20rpx;
|
||||
position: relative;
|
||||
background-color: #312C34;
|
||||
color: #FFFFFF;
|
||||
box-sizing: border-box;
|
||||
border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
|
||||
.speed_rank_view {
|
||||
.top {
|
||||
width: 100%;
|
||||
|
||||
&:after {
|
||||
content: "";
|
||||
clear: both;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.item {
|
||||
float: left;
|
||||
width: 33%;
|
||||
box-sizing: border-box;
|
||||
padding: 30rpx 20rpx;
|
||||
text-align: left;
|
||||
|
||||
.name {
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.data {
|
||||
font-size: 40rpx;
|
||||
margin-top: 10rpx;
|
||||
|
||||
.unit {
|
||||
font-size: 24rpx;
|
||||
margin-left: 14rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sport_analysis_view {
|
||||
width: 100%;
|
||||
padding: 20rpx;
|
||||
position: relative;
|
||||
background-color: #312C34;
|
||||
color: #FFFFFF;
|
||||
box-sizing: border-box;
|
||||
border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.top {
|
||||
width: 100%;
|
||||
height: 120rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.icon-feiji {
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
.title {
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.middle {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 28rpx;
|
||||
|
||||
.iconfont {
|
||||
font-size: 28rpx;
|
||||
margin-right: 10rpx;
|
||||
margin-top: 4rpx;
|
||||
}
|
||||
|
||||
.left {
|
||||
width: 50%;
|
||||
height: 60rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.right {
|
||||
width: 50%;
|
||||
height: 60rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
}
|
||||
|
||||
.bottom {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 28rpx;
|
||||
|
||||
.iconfont {
|
||||
font-size: 28rpx;
|
||||
margin-right: 10rpx;
|
||||
margin-top: 4rpx;
|
||||
}
|
||||
|
||||
.left {
|
||||
width: 50%;
|
||||
height: 60rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
|
||||
.icon-kongxinyuan {
|
||||
color: #6FCEF7;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
width: 50%;
|
||||
height: 60rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.heart_rate_range {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
background-color: #312C34;
|
||||
color: #FFFFFF;
|
||||
box-sizing: border-box;
|
||||
border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.top {
|
||||
width: 100%;
|
||||
|
||||
&:after {
|
||||
content: "";
|
||||
clear: both;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.item {
|
||||
float: left;
|
||||
width: 33%;
|
||||
box-sizing: border-box;
|
||||
padding: 30rpx 20rpx;
|
||||
text-align: center;
|
||||
|
||||
.name {
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.data {
|
||||
font-size: 40rpx;
|
||||
margin-top: 10rpx;
|
||||
|
||||
.unit {
|
||||
font-size: 24rpx;
|
||||
margin-left: 14rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.heart_rate_chart {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
background-color: #312C34;
|
||||
color: #FFFFFF;
|
||||
box-sizing: border-box;
|
||||
border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.title_view {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
align-items: center;
|
||||
height: 150rpx;
|
||||
|
||||
.left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.iconfont {
|
||||
font-size: 40rpx !important;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 34rpx;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.heart_rate_view {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
height: 150rpx;
|
||||
|
||||
.left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.icon-zhexiantu {
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 34rpx;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
font-size: 22rpx;
|
||||
padding: 10rpx 30rpx;
|
||||
border-radius: 40rpx;
|
||||
background-color: #342E39;
|
||||
}
|
||||
}
|
||||
|
||||
.consume_view {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 190rpx;
|
||||
position: relative;
|
||||
margin-top: 100rpx;
|
||||
background-color: #312C34;
|
||||
color: #FFFFFF;
|
||||
box-sizing: border-box;
|
||||
border-radius: 10rpx;
|
||||
|
||||
.consume_img {
|
||||
width: 240rpx;
|
||||
height: auto;
|
||||
position: absolute;
|
||||
top: -80rpx;
|
||||
left: 20rpx;
|
||||
}
|
||||
|
||||
.consume_icon {
|
||||
font-size: 220rpx;
|
||||
position: absolute;
|
||||
top: -80rpx;
|
||||
left: 20rpx;
|
||||
}
|
||||
|
||||
.desc {
|
||||
position: absolute;
|
||||
right: 80rpx;
|
||||
top: 20rpx;
|
||||
|
||||
view {
|
||||
padding: 10rpx 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.left {
|
||||
font-size: 50rpx;
|
||||
}
|
||||
|
||||
.right {
|
||||
font-size: 30rpx;
|
||||
margin-left: 10rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.text-green {
|
||||
color: #10A764;
|
||||
}
|
||||
|
||||
.text_gray {
|
||||
color: #8E8B8B;
|
||||
}
|
||||
|
||||
.small_text {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.font-s-34 {
|
||||
font-size: 34rpx;
|
||||
}
|
||||
|
||||
.font-s-36 {
|
||||
font-size: 36rpx;
|
||||
}
|
||||
|
||||
.font-s-38 {
|
||||
font-size: 38rpx;
|
||||
}
|
||||
|
||||
.font-s-40 {
|
||||
font-size: 40rpx;
|
||||
}
|
||||
|
||||
.middle_text {
|
||||
font-size: 36rpx;
|
||||
}
|
||||
|
||||
.text_wide_900 {
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.text_wide_600 {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.census_view {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
|
||||
.left {
|
||||
text-align: left;
|
||||
|
||||
view {
|
||||
padding: 10rpx 0;
|
||||
}
|
||||
}
|
||||
|
||||
.center {
|
||||
text-align: center;
|
||||
|
||||
view {
|
||||
padding: 10rpx 0;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
text-align: right;
|
||||
|
||||
view {
|
||||
padding: 10rpx 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.score_view {
|
||||
width: 100%;
|
||||
|
||||
.title {
|
||||
color: #8E8B8B;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.detail {
|
||||
height: 120rpx;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
|
||||
.icon-up {
|
||||
margin-left: 40rpx;
|
||||
height: 54rpx;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.socre {
|
||||
font-size: 80rpx;
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.up_socre {
|
||||
color: #10A764;
|
||||
height: 50rpx;
|
||||
font-size: 24rpx;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.head {
|
||||
height: 140rpx;
|
||||
line-height: 140rpx;
|
||||
position: relative;
|
||||
|
||||
.title {
|
||||
font-size: 40rpx;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
|
||||
.customer_img {
|
||||
position: absolute;
|
||||
bottom: 0rpx;
|
||||
right: 20rpx;
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-size: 100% 100%;
|
||||
border-radius: 100%;
|
||||
overflow: hidden;
|
||||
|
||||
.img {
|
||||
height: auto;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
li {
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.nav {
|
||||
position: fixed;
|
||||
top: 50rpx;
|
||||
left: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.consume_view:nth-child(even) {
|
||||
margin-right: 4%;
|
||||
}
|
||||
|
||||
.consume_tip {
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
width: 188rpx;
|
||||
height: 30rpx;
|
||||
line-height: 30rpx;
|
||||
position: absolute;
|
||||
top: 36rpx;
|
||||
right: -44rpx;
|
||||
z-index: 2;
|
||||
overflow: hidden;
|
||||
transform: rotate(45deg);
|
||||
-ms-transform: rotate(45deg);
|
||||
-moz-transform: rotate(45deg);
|
||||
-webkit-transform: rotate(45deg);
|
||||
-o-transform: rotate(45deg);
|
||||
border: 1px dashed;
|
||||
box-shadow: 0 0 0 3px #10A764, 0px 21px 5px -18px rgba(0, 0, 0, 0.6);
|
||||
background: #10A764;
|
||||
font-size: 16rpx;
|
||||
}
|
||||
|
||||
.wrap {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
top: -12rpx;
|
||||
left: 12rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.wrap:before {
|
||||
content: "";
|
||||
display: block;
|
||||
border-radius: 8px 8px 0px 0px;
|
||||
width: 80rpx;
|
||||
height: 14rpx;
|
||||
position: absolute;
|
||||
right: 68rpx;
|
||||
top: -1px;
|
||||
background: #4D6530;
|
||||
}
|
||||
|
||||
.wrap:after {
|
||||
content: "";
|
||||
display: block;
|
||||
border-radius: 0px 8px 8px 0px;
|
||||
width: 14rpx;
|
||||
height: 80rpx;
|
||||
position: absolute;
|
||||
right: -1px;
|
||||
top: 66rpx;
|
||||
background: #4D6530;
|
||||
}</style>
|
||||
@ -0,0 +1,79 @@
|
||||
|
||||
const COLOR = [
|
||||
"#EE6A66", "#6BC588", "#FFC300", "#24ABFD"
|
||||
];
|
||||
|
||||
var ISCANVAS2D = true;
|
||||
|
||||
switch (uni.getSystemInfoSync().platform) {
|
||||
case 'android':
|
||||
ISCANVAS2D = true
|
||||
break;
|
||||
case 'ios':
|
||||
ISCANVAS2D = true
|
||||
break;
|
||||
default:
|
||||
ISCANVAS2D = false
|
||||
break;
|
||||
}
|
||||
|
||||
const RESPOND = {
|
||||
success: 0,
|
||||
warn: 301,
|
||||
error: 500,
|
||||
};
|
||||
|
||||
const TIMEARRAY = [
|
||||
{
|
||||
text: '当天',
|
||||
value: 'today'
|
||||
},
|
||||
{
|
||||
text: '昨天',
|
||||
value: 'yesterday'
|
||||
},
|
||||
{
|
||||
text: '本周',
|
||||
value: 'week'
|
||||
},
|
||||
{
|
||||
text: '上周',
|
||||
value: 'weeklast'
|
||||
},
|
||||
{
|
||||
text: '本月',
|
||||
value: 'month'
|
||||
},
|
||||
{
|
||||
text: '上月',
|
||||
value: 'monthlast'
|
||||
},
|
||||
{
|
||||
text: '指定日期',
|
||||
value: 'auto'
|
||||
}
|
||||
];
|
||||
const TABLIST = [
|
||||
{name:"企业微信",type:"WECHAT"},
|
||||
{name:"会员运营",type:"OPERATE"},
|
||||
{name:"会员健康",type:"GJJK"},
|
||||
{name:"会员服务",type:"SERVICE"},
|
||||
];
|
||||
|
||||
const CARD_MENU = [
|
||||
{title:"会员报表中心",author:"howcode",img:"https://s1.ax1x.com/2023/03/31/ppRp4iV.jpg",url:"/myPackageA/pages/main/index"},
|
||||
{title:"智慧教育报表中心",author:"howcode",img:"https://s1.ax1x.com/2023/03/31/ppRp5GT.jpg",url:"/myPackageA/pages/school/index"},
|
||||
{title:"差旅报表中心",author:"秋云",img:"https://s1.ax1x.com/2023/03/31/ppRpfI0.jpg",url:""},
|
||||
{title:"运动报表中心",author:"howcode",img:"https://s1.ax1x.com/2023/03/31/ppRpWaq.jpg",url:"/myPackageA/pages/sport/index"},
|
||||
{title:"财务报表中心",author:"howcode",img:"https://s1.ax1x.com/2023/03/31/ppRpozF.jpg",url:"/myPackageA/pages/finance/index"},
|
||||
]
|
||||
|
||||
|
||||
export default {
|
||||
COLOR,
|
||||
TIMEARRAY,
|
||||
TABLIST,
|
||||
RESPOND,
|
||||
ISCANVAS2D,
|
||||
CARD_MENU
|
||||
}
|
||||
@ -0,0 +1,68 @@
|
||||
{
|
||||
"expend":{
|
||||
"categories": [
|
||||
"1月",
|
||||
"2月",
|
||||
"2月",
|
||||
"4月",
|
||||
"5月"
|
||||
],
|
||||
"series": [
|
||||
{
|
||||
"name": "支出情况",
|
||||
"data": [1201,2501.5,985,1760,2013.85],
|
||||
"type": "line",
|
||||
"style": "curve",
|
||||
"color": "#4ECDB6",
|
||||
"unit":""
|
||||
}
|
||||
],
|
||||
"yAxis":[
|
||||
{"calibration":true,"position":"left","title":"单位/元","titleFontSize":12,"unit":"","tofix":0,"min":0,"disableGrid":true}
|
||||
]
|
||||
},
|
||||
"income":{
|
||||
"categories": [
|
||||
"1月",
|
||||
"2月",
|
||||
"2月",
|
||||
"4月",
|
||||
"5月"
|
||||
],
|
||||
"series": [
|
||||
{
|
||||
"name": "收入情况",
|
||||
"data": [1601,1840.5,1900,1760,1500.85],
|
||||
"type": "line",
|
||||
"style": "curve",
|
||||
"color": "#4ECDB6",
|
||||
"unit":""
|
||||
}
|
||||
],
|
||||
"yAxis":[
|
||||
{"calibration":true,"position":"left","title":"单位/元","titleFontSize":12,"unit":"","tofix":0,"min":0,"disableGrid":true}
|
||||
]
|
||||
},
|
||||
"remaining":{
|
||||
"categories": [
|
||||
"1月",
|
||||
"2月",
|
||||
"2月",
|
||||
"4月",
|
||||
"5月"
|
||||
],
|
||||
"series": [
|
||||
{
|
||||
"name": "结余情况",
|
||||
"data": [815,712.5,378,450,600.85],
|
||||
"type": "line",
|
||||
"style": "curve",
|
||||
"color": "#4ECDB6",
|
||||
"unit":""
|
||||
}
|
||||
],
|
||||
"yAxis":[
|
||||
{"calibration":true,"position":"left","title":"单位/元","titleFontSize":12,"unit":"","tofix":0,"min":0,"disableGrid":true}
|
||||
]
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,33 @@
|
||||
{
|
||||
"series": [
|
||||
{
|
||||
"data":[
|
||||
{
|
||||
"name": "住房相关",
|
||||
"value": 3200,
|
||||
"color":"#4DCCB3"
|
||||
},
|
||||
{
|
||||
"name": "食品酒水",
|
||||
"value": 1020,
|
||||
"color":"#5A77EC"
|
||||
},
|
||||
{
|
||||
"name": "娱乐休闲",
|
||||
"value": 500,
|
||||
"color":"#4E94EC"
|
||||
},
|
||||
{
|
||||
"name": "交流通讯",
|
||||
"value": 214.5,
|
||||
"color":"#4FD4EB"
|
||||
},
|
||||
{
|
||||
"name": "其他",
|
||||
"value": 320.13,
|
||||
"color":"#B5ED21"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
@ -0,0 +1,26 @@
|
||||
[
|
||||
{
|
||||
"name":"课题研究",
|
||||
"num":500,
|
||||
"width":"",
|
||||
"background":"#FFBE68"
|
||||
},
|
||||
{
|
||||
"name":"论文发布",
|
||||
"num":300,
|
||||
"width":"",
|
||||
"background":"#0FEBE1"
|
||||
},
|
||||
{
|
||||
"name":"实践研究",
|
||||
"num":455,
|
||||
"width":"",
|
||||
"background":"#BF8DFC"
|
||||
},
|
||||
{
|
||||
"name":"评教",
|
||||
"num":601,
|
||||
"width":"",
|
||||
"background":"#FF859C"
|
||||
}
|
||||
]
|
||||
@ -0,0 +1,28 @@
|
||||
{
|
||||
"series": [
|
||||
{
|
||||
"data": [
|
||||
{
|
||||
"name": "本科",
|
||||
"value": 168,
|
||||
"color": "#FFBF31"
|
||||
},
|
||||
{
|
||||
"name": "大专",
|
||||
"value": 144,
|
||||
"color": "#3CEFC4"
|
||||
},
|
||||
{
|
||||
"name": "博士",
|
||||
"value": 123,
|
||||
"color": "#FFA9B3"
|
||||
},
|
||||
{
|
||||
"name": "硕士",
|
||||
"value": 96,
|
||||
"color": "#3CBBFF"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
@ -0,0 +1,27 @@
|
||||
{
|
||||
"categories":["语文","数学","英语","物理","化学","生物"],
|
||||
"series":[
|
||||
{
|
||||
"name":"一班",
|
||||
"area":[123.45,234,192.5,245],
|
||||
"color":"#1890ff",
|
||||
"data":[90,110,165,195,187,172],
|
||||
"index":0,
|
||||
"legendShape":"circle",
|
||||
"pointShape":"",
|
||||
"show": true,
|
||||
"type": "radar"
|
||||
},
|
||||
{
|
||||
"name":"二班",
|
||||
"area":[192.5,234,261.55,245],
|
||||
"color":"#2fc25b",
|
||||
"data":[190,210,105,35,27,102],
|
||||
"index":0,
|
||||
"legendShape":"circle",
|
||||
"pointShape":"",
|
||||
"show": true,
|
||||
"type": "radar"
|
||||
}
|
||||
]
|
||||
}
|
||||
@ -0,0 +1,29 @@
|
||||
{
|
||||
"categories": [
|
||||
"1",
|
||||
"2",
|
||||
"2",
|
||||
"4",
|
||||
"5",
|
||||
"6",
|
||||
"7",
|
||||
"8",
|
||||
"9",
|
||||
"10",
|
||||
"11",
|
||||
"12"
|
||||
],
|
||||
"series": [
|
||||
{
|
||||
"name": "图书借阅人数",
|
||||
"data": [6,8,9,8.2,7.5,9,10.3,8,12,6.2,7.2,4.5],
|
||||
"type": "line",
|
||||
"style": "curve",
|
||||
"color": "#A800FB",
|
||||
"unit":""
|
||||
}
|
||||
],
|
||||
"yAxis":[
|
||||
{"calibration":true,"position":"left","title":"单位/千","titleFontSize":12,"unit":"","tofix":0,"min":0,"max":20,"disableGrid":true}
|
||||
]
|
||||
}
|
||||
@ -0,0 +1,80 @@
|
||||
{
|
||||
"series": [{
|
||||
"name": "激活放松",
|
||||
"color": "#FDEC9F",
|
||||
"data": [
|
||||
["17:24", 75],
|
||||
["17:26", 83],
|
||||
["17:28", 88],
|
||||
["17:30", 92]
|
||||
]
|
||||
},
|
||||
{
|
||||
"name": "动态热身",
|
||||
"color": "#FBCD2B",
|
||||
"data": [
|
||||
["17:30", 92],
|
||||
["17:32", 96],
|
||||
["17:34", 94],
|
||||
["17:36", 93.5],
|
||||
["17:38", 94.6],
|
||||
["17:40", 98]
|
||||
]
|
||||
},
|
||||
{
|
||||
"name": "糖分消耗",
|
||||
"color": "#FC9E83",
|
||||
"data": [
|
||||
["17:40", 98],
|
||||
["17:42", 100],
|
||||
["17:44", 104],
|
||||
["17:46", 113],
|
||||
["17:48", 142]
|
||||
]
|
||||
},
|
||||
{
|
||||
"name": "脂肪燃烧",
|
||||
"color": "#EF6DCF",
|
||||
"data": [
|
||||
["17:48", 142],
|
||||
["17:50", 130],
|
||||
["17:52", 134],
|
||||
["17:54", 150],
|
||||
["17:56", 148],
|
||||
["17:58", 142],
|
||||
["18:00", 132],
|
||||
["18:02", 136],
|
||||
["18:04", 136.5]
|
||||
]
|
||||
},
|
||||
{
|
||||
"name": "心肺训练",
|
||||
"color": "#BC38E5",
|
||||
"data": [
|
||||
["18:04", 136.5],
|
||||
["18:06", 140],
|
||||
["18:08", 135],
|
||||
["18:10", 130],
|
||||
["18:12", 124],
|
||||
["18:14", 120],
|
||||
["18:16", 118],
|
||||
["18:18", 116.5],
|
||||
["18:20", 112]
|
||||
]
|
||||
}, {
|
||||
"name": "极限锻炼",
|
||||
"color": "#8908FA",
|
||||
"data": [
|
||||
["18:20", 112],
|
||||
["18:22", 123],
|
||||
["18:24", 130],
|
||||
["18:26", 138],
|
||||
["18:28", 116],
|
||||
["18:30", 123],
|
||||
["18:32", 128],
|
||||
["18:34", 126],
|
||||
["18:36", 137]
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
@ -0,0 +1,38 @@
|
||||
{
|
||||
"series": [
|
||||
{
|
||||
"data": [
|
||||
{
|
||||
"name": "激活放松",
|
||||
"value": 5,
|
||||
"color": "#FDEC9F"
|
||||
},
|
||||
{
|
||||
"name": "动态热身",
|
||||
"value": 13,
|
||||
"color": "#FBCD2B"
|
||||
},
|
||||
{
|
||||
"name": "糖分消耗",
|
||||
"value": 8,
|
||||
"color": "#FC9E83"
|
||||
},
|
||||
{
|
||||
"name": "脂肪燃烧",
|
||||
"value": 24,
|
||||
"color": "#EF6DCF"
|
||||
},
|
||||
{
|
||||
"name": "心肺训练",
|
||||
"value": 7,
|
||||
"color": "#BC38E5"
|
||||
},
|
||||
{
|
||||
"name": "极限锻炼",
|
||||
"value": 16,
|
||||
"color": "#8908FA"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
@ -0,0 +1,22 @@
|
||||
{
|
||||
"categories": [
|
||||
"1",
|
||||
"2",
|
||||
"3",
|
||||
"4",
|
||||
"5"
|
||||
],
|
||||
"series": [
|
||||
{
|
||||
"name": "公里配速",
|
||||
"data": [
|
||||
5.09,
|
||||
6.18,
|
||||
6.38,
|
||||
7.15,
|
||||
9.05
|
||||
],
|
||||
"color":"#FFD597"
|
||||
}
|
||||
]
|
||||
}
|
||||
@ -0,0 +1,174 @@
|
||||
{
|
||||
"series": [
|
||||
{
|
||||
"name": "速度",
|
||||
"color": "#1C9862",
|
||||
"index":0,
|
||||
"data": [
|
||||
[
|
||||
"17:24",
|
||||
0
|
||||
],
|
||||
[
|
||||
"17:26",
|
||||
1
|
||||
],
|
||||
[
|
||||
"17:28",
|
||||
1.2
|
||||
],
|
||||
[
|
||||
"17:30",
|
||||
1.6
|
||||
],
|
||||
[
|
||||
"17:32",
|
||||
1.8
|
||||
],
|
||||
[
|
||||
"17:34",
|
||||
2
|
||||
],
|
||||
[
|
||||
"17:36",
|
||||
4
|
||||
],
|
||||
[
|
||||
"17:38",
|
||||
6.5
|
||||
],
|
||||
[
|
||||
"17:40",
|
||||
10
|
||||
],
|
||||
[
|
||||
"17:42",
|
||||
13.4
|
||||
],
|
||||
[
|
||||
"17:44",
|
||||
13
|
||||
],
|
||||
[
|
||||
"17:46",
|
||||
12.6
|
||||
],
|
||||
[
|
||||
"17:48",
|
||||
12.2
|
||||
],
|
||||
[
|
||||
"17:50",
|
||||
14
|
||||
],
|
||||
[
|
||||
"17:52",
|
||||
16.8
|
||||
],
|
||||
[
|
||||
"17:54",
|
||||
20
|
||||
],
|
||||
[
|
||||
"17:56",
|
||||
25
|
||||
],
|
||||
[
|
||||
"17:58",
|
||||
23
|
||||
],
|
||||
[
|
||||
"18:00",
|
||||
16
|
||||
]
|
||||
]
|
||||
},
|
||||
{
|
||||
"name": "心率",
|
||||
"index":1,
|
||||
"color": "#FBCD2B",
|
||||
"data": [
|
||||
[
|
||||
"17:24",
|
||||
72
|
||||
],
|
||||
[
|
||||
"17:26",
|
||||
73
|
||||
],
|
||||
[
|
||||
"17:28",
|
||||
73.5
|
||||
],
|
||||
[
|
||||
"17:30",
|
||||
74
|
||||
],
|
||||
[
|
||||
"17:32",
|
||||
76.5
|
||||
],
|
||||
[
|
||||
"17:34",
|
||||
78
|
||||
],
|
||||
[
|
||||
"17:36",
|
||||
80
|
||||
],
|
||||
[
|
||||
"17:38",
|
||||
76.3
|
||||
],
|
||||
[
|
||||
"17:40",
|
||||
75
|
||||
],
|
||||
[
|
||||
"17:42",
|
||||
86
|
||||
],
|
||||
[
|
||||
"17:44",
|
||||
84
|
||||
],
|
||||
[
|
||||
"17:46",
|
||||
90
|
||||
],
|
||||
[
|
||||
"17:48",
|
||||
100
|
||||
],
|
||||
[
|
||||
"17:50",
|
||||
112
|
||||
],
|
||||
[
|
||||
"17:52",
|
||||
125
|
||||
],
|
||||
[
|
||||
"17:54",
|
||||
117
|
||||
],
|
||||
[
|
||||
"17:56",
|
||||
110
|
||||
],
|
||||
[
|
||||
"17:58",
|
||||
108
|
||||
],
|
||||
[
|
||||
"18:00",
|
||||
104
|
||||
]
|
||||
]
|
||||
}
|
||||
],
|
||||
"yAxis":[
|
||||
{"calibration":true,"position":"left","title":"","titleFontSize":12,"unit":"","tofix":0,"min":0,"max":25,"disableGrid":true},
|
||||
{"calibration":true,"position":"right","title":"","titleFontSize":12,"unit":"","tofix":0,"min":0,"disableGrid":true}
|
||||
]
|
||||
}
|
||||
@ -0,0 +1,21 @@
|
||||
[
|
||||
{
|
||||
"expect": "",
|
||||
"now": "",
|
||||
"name": "时间进度",
|
||||
"value": "60.12"
|
||||
},
|
||||
{
|
||||
"expect": "30000",
|
||||
"now": "36000",
|
||||
"dataType": "1",
|
||||
"name": "会员拉新",
|
||||
"value": "120"
|
||||
},
|
||||
{
|
||||
"expect": "",
|
||||
"now": "",
|
||||
"name": "扫码渗透率",
|
||||
"value": "35"
|
||||
}
|
||||
]
|
||||
@ -0,0 +1,34 @@
|
||||
[
|
||||
{
|
||||
"kind":1,
|
||||
"background":["#B678FD","#4A64F9"],
|
||||
"content":[
|
||||
{"text":"","value":"1800","colortext":"","colorvalue":"#fff","size":"44rpx"},
|
||||
{"text":"日均新增目标","value":"","colortext":"#fff","colorvalue":"","size":"24rpx"}
|
||||
]
|
||||
},
|
||||
{
|
||||
"kind":1,
|
||||
"background":["#B678FD","#4A64F9"],
|
||||
"content":[
|
||||
{"text":"","value":"1960","colortext":"","colorvalue":"#fff","size":"44rpx"},
|
||||
{"text":"当日新增会员","value":"","colortext":"#fff","colorvalue":"","size":"24rpx"}
|
||||
]
|
||||
},
|
||||
{
|
||||
"kind":1,
|
||||
"background":["#B678FD","#4A64F9"],
|
||||
"content":[
|
||||
{"text":"","value":"36050","colortext":"","colorvalue":"#fff","size":"44rpx"},
|
||||
{"text":"本月新增会员","value":"","colortext":"#fff","colorvalue":"","size":"24rpx"}
|
||||
]
|
||||
},
|
||||
{
|
||||
"kind":1,
|
||||
"background":["#B678FD","#4A64F9"],
|
||||
"content":[
|
||||
{"text":"","value":"3%","colortext":"","colorvalue":"#fff","size":"44rpx"},
|
||||
{"text":"日均环比","value":"","colortext":"#fff","colorvalue":"","size":"24rpx"}
|
||||
]
|
||||
}
|
||||
]
|
||||
@ -0,0 +1,74 @@
|
||||
{
|
||||
"categories": [
|
||||
"1月11",
|
||||
"1月12",
|
||||
"1月11",
|
||||
"1月14",
|
||||
"1月15"
|
||||
],
|
||||
"series": [{
|
||||
"name": "新增会员数",
|
||||
"data": [{
|
||||
"value": 5,
|
||||
"color": "#24ABFD"
|
||||
},
|
||||
{
|
||||
"value": -3,
|
||||
"color": "#24ABFD"
|
||||
},
|
||||
{
|
||||
"value": 3.5,
|
||||
"color": "#24ABFD"
|
||||
},
|
||||
{
|
||||
"value": 10,
|
||||
"color": "#24ABFD"
|
||||
},
|
||||
{
|
||||
"value": 2.8,
|
||||
"color": "#24ABFD"
|
||||
}
|
||||
],
|
||||
"type": "column",
|
||||
"color": "#24ABFD",
|
||||
"unit": "",
|
||||
"textNoShow": true
|
||||
},
|
||||
{
|
||||
"name": "当日达成率",
|
||||
"data": [
|
||||
101,
|
||||
91,
|
||||
97,
|
||||
131,
|
||||
109
|
||||
],
|
||||
"type": "line",
|
||||
"addPoint": true,
|
||||
"color": "#DF297D",
|
||||
"unit": "%",
|
||||
"index": 1
|
||||
},
|
||||
{
|
||||
"name": "日均达成率",
|
||||
"data": [
|
||||
102,
|
||||
92,
|
||||
96,
|
||||
115,
|
||||
105
|
||||
],
|
||||
"type": "line",
|
||||
"color": "#24ABFD",
|
||||
"unit": "%",
|
||||
"index": 1
|
||||
}
|
||||
],
|
||||
"yAxis": [{
|
||||
"max": 20,
|
||||
"min": 0
|
||||
}, {
|
||||
"max": 200,
|
||||
"min": 0
|
||||
}]
|
||||
}
|
||||
@ -0,0 +1,26 @@
|
||||
[
|
||||
{
|
||||
"kind":1,
|
||||
"background":["#B678FD","#4A64F9"],
|
||||
"content":[
|
||||
{"text":"","value":"42%","colortext":"","colorvalue":"#fff","size":"44rpx"},
|
||||
{"text":"当日扫码率","value":"","colortext":"#fff","colorvalue":"","size":"24rpx"}
|
||||
]
|
||||
},
|
||||
{
|
||||
"kind":1,
|
||||
"background":["#B678FD","#4A64F9"],
|
||||
"content":[
|
||||
{"text":"","value":"37%","colortext":"","colorvalue":"#fff","size":"44rpx"},
|
||||
{"text":"累计扫码率","value":"","colortext":"#fff","colorvalue":"","size":"24rpx"}
|
||||
]
|
||||
},
|
||||
{
|
||||
"kind":2,
|
||||
"background":["#B678FD","#4A64F9"],
|
||||
"content":[
|
||||
{"text":"环比增长","value":"3.2%","colortext":"#fff","colorvalue":"#fff","size":"24rpx"},
|
||||
{"text":"同比增长","value":"1.1%","colortext":"#fff","colorvalue":"#fff","size":"24rpx"}
|
||||
]
|
||||
}
|
||||
]
|
||||
@ -0,0 +1,57 @@
|
||||
{
|
||||
"categories": [
|
||||
"1月11",
|
||||
"1月12",
|
||||
"1月13",
|
||||
"1月14",
|
||||
"1月15"
|
||||
],
|
||||
"series": [{
|
||||
"name": "当天扫码率",
|
||||
"data": [
|
||||
39,
|
||||
34,
|
||||
36,
|
||||
45,
|
||||
38
|
||||
],
|
||||
"type": "line",
|
||||
"addPoint": true,
|
||||
"color": "#24ABFD",
|
||||
"unit": "%"
|
||||
},
|
||||
{
|
||||
"name": "累计扫码率",
|
||||
"data": [
|
||||
32,
|
||||
30,
|
||||
31,
|
||||
37,
|
||||
35
|
||||
],
|
||||
"type": "line",
|
||||
"addPoint": true,
|
||||
"color": "#DF297D",
|
||||
"unit": "%"
|
||||
},
|
||||
{
|
||||
"name": "目标扫码率",
|
||||
"data": [
|
||||
40,
|
||||
40,
|
||||
40,
|
||||
40,
|
||||
40
|
||||
],
|
||||
"type": "line",
|
||||
"color": "#FF9900",
|
||||
"textNoShow": true,
|
||||
"unit": ""
|
||||
}
|
||||
|
||||
],
|
||||
"yAxis": [{
|
||||
"max": 60,
|
||||
"min": 0
|
||||
}]
|
||||
}
|
||||
@ -0,0 +1,12 @@
|
||||
[
|
||||
{
|
||||
"kind":3,
|
||||
"background":["#B678FD","#4A64F9"],
|
||||
"content":[
|
||||
{"text":"","value":"38%","colortext":"","colorvalue":"#fff","size":"44rpx"},
|
||||
{"text":"小程序购买活跃会员占比","value":"","colortext":"#fff","colorvalue":"","size":"24rpx"},
|
||||
{"text":"同比","value":"2.5%","colortext":"#fff","colorvalue":"#fff","size":"20rpx"},
|
||||
{"text":"环比","value":"3.2%","colortext":"#fff","colorvalue":"#fff","size":"20rpx"}
|
||||
]
|
||||
}
|
||||
]
|
||||
@ -0,0 +1,89 @@
|
||||
{
|
||||
"categories": [
|
||||
"1月11",
|
||||
"1月12",
|
||||
"1月11",
|
||||
"1月14",
|
||||
"1月15"
|
||||
],
|
||||
"series": [{
|
||||
"name": "新增会员数",
|
||||
"data": [{
|
||||
"value": 5,
|
||||
"color": "#24ABFD"
|
||||
},
|
||||
{
|
||||
"value": -3,
|
||||
"color": "#24ABFD"
|
||||
},
|
||||
{
|
||||
"value": 3.5,
|
||||
"color": "#24ABFD"
|
||||
},
|
||||
{
|
||||
"value": 10,
|
||||
"color": "#24ABFD"
|
||||
},
|
||||
{
|
||||
"value": 2.8,
|
||||
"color": "#24ABFD"
|
||||
}
|
||||
],
|
||||
"type": "column",
|
||||
"color": "#24ABFD",
|
||||
"unit": "",
|
||||
"textNoShow": true
|
||||
},
|
||||
{
|
||||
"name": "当日达成率",
|
||||
"data": [
|
||||
101,
|
||||
91,
|
||||
97,
|
||||
131,
|
||||
109
|
||||
],
|
||||
"type": "line",
|
||||
"addPoint": true,
|
||||
"color": "#DF297D",
|
||||
"unit": "%",
|
||||
"index": 1
|
||||
},
|
||||
{
|
||||
"name": "日均达成率",
|
||||
"data": [
|
||||
102,
|
||||
92,
|
||||
96,
|
||||
115,
|
||||
105
|
||||
],
|
||||
"type": "line",
|
||||
"style": "curve",
|
||||
"color": "#ff9900",
|
||||
"unit": "%",
|
||||
"index": 1
|
||||
},
|
||||
{
|
||||
"name": "日均达成率",
|
||||
"data": [
|
||||
102,
|
||||
92,
|
||||
96,
|
||||
115,
|
||||
105
|
||||
],
|
||||
"type": "area",
|
||||
"color": "#ff9900",
|
||||
"unit": "%",
|
||||
"index": 1
|
||||
}
|
||||
],
|
||||
"yAxis": [{
|
||||
"max": 20,
|
||||
"min": 0
|
||||
}, {
|
||||
"max": 200,
|
||||
"min": 0
|
||||
}]
|
||||
}
|
||||
@ -0,0 +1,22 @@
|
||||
[
|
||||
{
|
||||
"expect": "",
|
||||
"now": "",
|
||||
"name": "时间进度",
|
||||
"value": "50.88"
|
||||
},
|
||||
{
|
||||
"expect": "54800",
|
||||
"now": "51000",
|
||||
"dataType": "1",
|
||||
"name": "新开会员",
|
||||
"value": "93.07"
|
||||
},
|
||||
{
|
||||
"expect": "30000",
|
||||
"now": "25600",
|
||||
"dataType": "1",
|
||||
"name": "新增消费会员",
|
||||
"value": "85.33"
|
||||
}
|
||||
]
|
||||
@ -0,0 +1,35 @@
|
||||
[
|
||||
{
|
||||
"kind":5,
|
||||
"background":["#F77E89","#F7953B"],
|
||||
"content":[
|
||||
{"text":"扫一扫","value":"","colortext":"#fff","colorvalue":"","size":"24rpx"},
|
||||
{"text":"","value":"63%","colortext":"","colorvalue":"#fff","size":"44rpx"},
|
||||
{"text":"环比","value":"81.5%","colortext":"#fff","colorvalue":"#fff","size":"20rpx"},
|
||||
{"text":"同比","value":"-81.3%","colortext":"#fff","colorvalue":"#fff","size":"20rpx"},
|
||||
{"text":"平均参考水平","value":"85%","colortext":"#fff","colorvalue":"#fff","size":"20rpx"}
|
||||
]
|
||||
},
|
||||
{
|
||||
"kind":5,
|
||||
"background":["#F77E89","#F7953B"],
|
||||
"content":[
|
||||
{"text":"二维码识别","value":"","colortext":"#fff","colorvalue":"","size":"24rpx"},
|
||||
{"text":"","value":"13%","colortext":"","colorvalue":"#fff","size":"44rpx"},
|
||||
{"text":"环比","value":"2%","colortext":"#fff","colorvalue":"#fff","size":"20rpx"},
|
||||
{"text":"同比","value":"-0.8%","colortext":"#fff","colorvalue":"#fff","size":"20rpx"},
|
||||
{"text":"平均参考水平","value":"80%","colortext":"#fff","colorvalue":"#fff","size":"20rpx"}
|
||||
]
|
||||
},
|
||||
{
|
||||
"kind":5,
|
||||
"background":["#F77E89","#F7953B"],
|
||||
"content":[
|
||||
{"text":"最近使用","value":"","colortext":"#fff","colorvalue":"","size":"24rpx"},
|
||||
{"text":"","value":"21%","colortext":"","colorvalue":"#fff","size":"44rpx"},
|
||||
{"text":"环比","value":"1%","colortext":"#fff","colorvalue":"#fff","size":"20rpx"},
|
||||
{"text":"同比","value":"-0.8%","colortext":"#fff","colorvalue":"#fff","size":"20rpx"},
|
||||
{"text":"平均参考水平","value":"80%","colortext":"#fff","colorvalue":"#fff","size":"20rpx"}
|
||||
]
|
||||
}
|
||||
]
|
||||
@ -0,0 +1,35 @@
|
||||
[
|
||||
{
|
||||
"kind":5,
|
||||
"background":["#F77E89","#F7953B"],
|
||||
"content":[
|
||||
{"text":"会员销售占比","value":"","colortext":"#fff","colorvalue":"","size":"24rpx"},
|
||||
{"text":"","value":"80%","colortext":"","colorvalue":"#fff","size":"44rpx"},
|
||||
{"text":"环比","value":"81.5%","colortext":"#fff","colorvalue":"#fff","size":"20rpx"},
|
||||
{"text":"同比","value":"-81.3%","colortext":"#fff","colorvalue":"#fff","size":"20rpx"},
|
||||
{"text":"平均参考水平","value":"85%","colortext":"#fff","colorvalue":"#fff","size":"20rpx"}
|
||||
]
|
||||
},
|
||||
{
|
||||
"kind":5,
|
||||
"background":["#F77E89","#F7953B"],
|
||||
"content":[
|
||||
{"text":"会员客流占比","value":"","colortext":"#fff","colorvalue":"","size":"24rpx"},
|
||||
{"text":"","value":"79%","colortext":"","colorvalue":"#fff","size":"44rpx"},
|
||||
{"text":"环比","value":"2%","colortext":"#fff","colorvalue":"#fff","size":"20rpx"},
|
||||
{"text":"同比","value":"-0.8%","colortext":"#fff","colorvalue":"#fff","size":"20rpx"},
|
||||
{"text":"平均参考水平","value":"80%","colortext":"#fff","colorvalue":"#fff","size":"20rpx"}
|
||||
]
|
||||
},
|
||||
{
|
||||
"kind":5,
|
||||
"background":["#F77E89","#F7953B"],
|
||||
"content":[
|
||||
{"text":"会员客单价","value":"","colortext":"#fff","colorvalue":"","size":"24rpx"},
|
||||
{"text":"","value":"79元","colortext":"","colorvalue":"#fff","size":"44rpx"},
|
||||
{"text":"环比","value":"1%","colortext":"#fff","colorvalue":"#fff","size":"20rpx"},
|
||||
{"text":"同比","value":"-0.8%","colortext":"#fff","colorvalue":"#fff","size":"20rpx"},
|
||||
{"text":"平均参考水平","value":"80%","colortext":"#fff","colorvalue":"#fff","size":"20rpx"}
|
||||
]
|
||||
}
|
||||
]
|
||||
@ -0,0 +1,61 @@
|
||||
{
|
||||
"categories": [
|
||||
"1周",
|
||||
"2周",
|
||||
"3周",
|
||||
"4周",
|
||||
"5周"
|
||||
],
|
||||
"series": [{
|
||||
"name": "同比增长率",
|
||||
"data": [{
|
||||
"value": 5,
|
||||
"color": "#24ABFD"
|
||||
},
|
||||
{
|
||||
"value": -3,
|
||||
"color": "#24ABFD"
|
||||
},
|
||||
{
|
||||
"value": 3.5,
|
||||
"color": "#24ABFD"
|
||||
},
|
||||
{
|
||||
"value": 10,
|
||||
"color": "#24ABFD"
|
||||
},
|
||||
{
|
||||
"value": 2.8,
|
||||
"color": "#24ABFD"
|
||||
}
|
||||
],
|
||||
"type": "column",
|
||||
"color": "#24ABFD",
|
||||
"index": 1,
|
||||
"unit": "%"
|
||||
},
|
||||
{
|
||||
"name": "消费金额",
|
||||
"data": [
|
||||
1850,
|
||||
1660,
|
||||
1760,
|
||||
2360,
|
||||
1970
|
||||
],
|
||||
"type": "line",
|
||||
"addPoint": true,
|
||||
"color": "#DF297D",
|
||||
"unit": ""
|
||||
}
|
||||
],
|
||||
"target": 1800,
|
||||
"yAxis": [{
|
||||
"max": 3000,
|
||||
"min": 0
|
||||
}, {
|
||||
"max": 20,
|
||||
"min": 0
|
||||
}],
|
||||
"targetAdd": "9%"
|
||||
}
|
||||
@ -0,0 +1,88 @@
|
||||
{
|
||||
"headers":[
|
||||
{
|
||||
"label": "最近活跃时间",
|
||||
"key": "col1"
|
||||
}, {
|
||||
"label": "人数",
|
||||
"key": "col2"
|
||||
}, {
|
||||
"label": "人数占比",
|
||||
"key": "col3"
|
||||
}, {
|
||||
"label": "活跃会员环比",
|
||||
"key": "col4"
|
||||
}, {
|
||||
"label": "活跃消费人数占比",
|
||||
"key": "col5"
|
||||
}
|
||||
],
|
||||
"contents":[
|
||||
{
|
||||
"col1": "0-30天",
|
||||
"col2": "15350",
|
||||
"col3": "45",
|
||||
"col4": "9.5",
|
||||
"col5": "29"
|
||||
}, {
|
||||
"col1": "30-60天",
|
||||
"col2": "15350",
|
||||
"col3": "13",
|
||||
"col4": "-2.5",
|
||||
"col5": "-25"
|
||||
}, {
|
||||
"col1": "60-90天",
|
||||
"col2": "15371",
|
||||
"col3": "15",
|
||||
"col4": "-5.2",
|
||||
"col5": "63"
|
||||
}, {
|
||||
"col1": "90-120天",
|
||||
"col2": "12340",
|
||||
"col3": "12",
|
||||
"col4": "2.9",
|
||||
"col5": "-12"
|
||||
}, {
|
||||
"col1": "120-180天",
|
||||
"col2": "12360",
|
||||
"col3": "17",
|
||||
"col4": "3.5",
|
||||
"col5": "11"
|
||||
}
|
||||
],
|
||||
"sortCol":[
|
||||
{
|
||||
"key": "col1",
|
||||
"isNumber": false
|
||||
}, {
|
||||
"key": "col2",
|
||||
"isNumber": true
|
||||
},
|
||||
{
|
||||
"key": "col3",
|
||||
"isNumber": true
|
||||
},
|
||||
{
|
||||
"key": "col4",
|
||||
"isNumber": true
|
||||
},
|
||||
{
|
||||
"key": "col5",
|
||||
"isNumber": true
|
||||
}
|
||||
],
|
||||
"computedCol":["col2","col3","col4","col5"],
|
||||
"formatCol":[{
|
||||
"key": "col3",
|
||||
"template": "#col3#%",
|
||||
"bottomComputedFormat": true
|
||||
}, {
|
||||
"key": "col4",
|
||||
"template": "#col4#%",
|
||||
"bottomComputedFormat": true
|
||||
}, {
|
||||
"key": "col5",
|
||||
"template": "#col5#%",
|
||||
"bottomComputedFormat": true
|
||||
}]
|
||||
}
|
||||
@ -0,0 +1,25 @@
|
||||
[{
|
||||
"series": [{
|
||||
"color": "#24ABFD",
|
||||
"data": 0.18,
|
||||
"index": 0,
|
||||
"legendShape": "circle",
|
||||
"name": "当前脱落率",
|
||||
"pointShape": "circle",
|
||||
"show": true,
|
||||
"type": "arcbar"
|
||||
}]
|
||||
},
|
||||
{
|
||||
"series": [{
|
||||
"color": "#F04864",
|
||||
"data": 0.25,
|
||||
"index": 0,
|
||||
"legendShape": "circle",
|
||||
"name": "脱落率警示线",
|
||||
"pointShape": "circle",
|
||||
"show": true,
|
||||
"type": "arcbar"
|
||||
}]
|
||||
}
|
||||
]
|
||||
@ -0,0 +1,36 @@
|
||||
{
|
||||
"categories": [
|
||||
"高血压",
|
||||
"糖尿病",
|
||||
"痛风",
|
||||
"血脂",
|
||||
"尿酸"
|
||||
],
|
||||
"series": [{
|
||||
"name": "今周脱落率",
|
||||
"data": [{
|
||||
"value": 6,
|
||||
"color": "#24ABFD"
|
||||
},
|
||||
{
|
||||
"value": 3.2,
|
||||
"color": "#24ABFD"
|
||||
},
|
||||
{
|
||||
"value": 5.5,
|
||||
"color": "#24ABFD"
|
||||
},
|
||||
{
|
||||
"value": 8,
|
||||
"color": "#24ABFD"
|
||||
},
|
||||
{
|
||||
"value": 6,
|
||||
"color": "#24ABFD"
|
||||
}
|
||||
],
|
||||
"type": "column",
|
||||
"color": "#24ABFD",
|
||||
"unit": "%"
|
||||
}]
|
||||
}
|
||||
@ -0,0 +1,26 @@
|
||||
[{
|
||||
"series": [{
|
||||
"color": "#24ABFD",
|
||||
"data": 0.75,
|
||||
"index": 0,
|
||||
"legendShape": "circle",
|
||||
"name": "当前脱落率",
|
||||
"pointShape": "circle",
|
||||
"show": true,
|
||||
"type": "arcbar"
|
||||
}]
|
||||
},
|
||||
{
|
||||
"series": [{
|
||||
"color": "#F04864",
|
||||
"data": 0.33,
|
||||
"index": 0,
|
||||
"legendShape": "circle",
|
||||
"name": "脱落率警示线",
|
||||
"pointShape": "circle",
|
||||
"show": true,
|
||||
"type": "arcbar"
|
||||
}]
|
||||
}
|
||||
]
|
||||
|
||||
@ -0,0 +1,62 @@
|
||||
[
|
||||
{
|
||||
"series": [{
|
||||
"color": "#fff",
|
||||
"data": 0.224,
|
||||
"precent":"22.4%",
|
||||
"index": 0,
|
||||
"legendShape": "circle",
|
||||
"name": "B2C销售额",
|
||||
"pointShape": "circle",
|
||||
"show": true,
|
||||
"type": "arcbar",
|
||||
"value":"12786",
|
||||
"backgroundColor":"#00AEF9"
|
||||
}]
|
||||
},
|
||||
{
|
||||
"series": [{
|
||||
"color": "#fff",
|
||||
"data": 0.3717,
|
||||
"precent":"37.17%",
|
||||
"index": 0,
|
||||
"legendShape": "circle",
|
||||
"name": "B2C毛利率",
|
||||
"pointShape": "circle",
|
||||
"show": true,
|
||||
"type": "arcbar",
|
||||
"value":"1096",
|
||||
"backgroundColor":"#F55676"
|
||||
}]
|
||||
},
|
||||
{
|
||||
"series": [{
|
||||
"color": "#fff",
|
||||
"data": 0.0017,
|
||||
"precent":"0.17%",
|
||||
"index": 0,
|
||||
"legendShape": "circle",
|
||||
"name": "O2O销售额",
|
||||
"pointShape": "circle",
|
||||
"show": true,
|
||||
"type": "arcbar",
|
||||
"value":"147604",
|
||||
"backgroundColor":"#FAB215"
|
||||
}]
|
||||
},
|
||||
{
|
||||
"series": [{
|
||||
"color": "#fff",
|
||||
"data": 0.6321,
|
||||
"precent":"63.21%",
|
||||
"index": 0,
|
||||
"legendShape": "circle",
|
||||
"name": "O2O毛利率",
|
||||
"pointShape": "circle",
|
||||
"show": true,
|
||||
"type": "arcbar",
|
||||
"value":"173",
|
||||
"backgroundColor":"#2EC693"
|
||||
}]
|
||||
}
|
||||
]
|
||||
@ -0,0 +1,29 @@
|
||||
{
|
||||
"series": [
|
||||
{
|
||||
"name": "任务栏最近使用",
|
||||
"data": 500,
|
||||
"color":"#2fc25b"
|
||||
},
|
||||
{
|
||||
"name": "最近使用小程序列表",
|
||||
"data": 623,
|
||||
"color":"#facc14"
|
||||
},
|
||||
{
|
||||
"name": "手机系统",
|
||||
"data": 123,
|
||||
"color":"#f04864"
|
||||
},
|
||||
{
|
||||
"name": "任务栏我的小程序",
|
||||
"data": 96,
|
||||
"color":"#8543e0"
|
||||
},
|
||||
{
|
||||
"name": "其他",
|
||||
"data": 423,
|
||||
"color":"#51c2d5"
|
||||
}
|
||||
]
|
||||
}
|
||||
@ -0,0 +1,36 @@
|
||||
{
|
||||
"categories": [
|
||||
"周一",
"周二",
"周三",
"周四",
"周五",
|
||||
"周六",
|
||||
"周日"
|
||||
],
|
||||
"series": [
|
||||
{
|
||||
"name": "老会员",
"data": [
1850,
1660,
1760,
2360,
1560,
1970,
2570
],
"type": "line",
|
||||
"style": "curve",
|
||||
"addPoint": true,
"color": "#DF297D",
|
||||
"unit":""
|
||||
},
|
||||
{
|
||||
"name": "新会员",
|
||||
"data": [
|
||||
450,
|
||||
260,
|
||||
360,
|
||||
560,
|
||||
460,
|
||||
170,
|
||||
570
|
||||
],
|
||||
"type": "line",
|
||||
"style": "curve",
|
||||
"addPoint": true,
|
||||
"color": "#ff9900",
|
||||
"unit":""
|
||||
}
|
||||
],
|
||||
"yAxis":[
|
||||
{"calibration":true,"position":"left","min":0,"max":3000,"title":"","titleFontSize":12,"unit":"万","tofix":0}
|
||||
],
|
||||
"targetAdd":"9%"
|
||||
}
|
||||
@ -0,0 +1,32 @@
|
||||
[
|
||||
{
|
||||
"kind":4,
|
||||
"background":["#0081ff","#1cbbb4"],
|
||||
"content":[
|
||||
{"text":"已评价数","value":"","colortext":"#fff","colorvalue":"","size":"24rpx"},
|
||||
{"text":"","value":"161","colortext":"","colorvalue":"#fff","size":"44rpx"},
|
||||
{"text":"增长","value":"","colortext":"#fff","colorvalue":"","size":"20rpx"},
|
||||
{"text":"up","value":"325","colortext":"#fff","colorvalue":"#fff","size":"20rpx"}
|
||||
]
|
||||
},
|
||||
{
|
||||
"kind":4,
|
||||
"background":["#0081ff","#1cbbb4"],
|
||||
"content":[
|
||||
{"text":"平均分","value":"","colortext":"#fff","colorvalue":"","size":"24rpx"},
|
||||
{"text":"","value":"82","colortext":"","colorvalue":"#fff","size":"44rpx"},
|
||||
{"text":"增长","value":"","colortext":"#fff","colorvalue":"","size":"20rpx"},
|
||||
{"text":"up","value":"0.7","colortext":"#fff","colorvalue":"#fff","size":"20rpx"}
|
||||
]
|
||||
},
|
||||
{
|
||||
"kind":4,
|
||||
"background":["#0081ff","#1cbbb4"],
|
||||
"content":[
|
||||
{"text":"好评率","value":"","colortext":"#fff","colorvalue":"","size":"24rpx"},
|
||||
{"text":"","value":"161","colortext":"","colorvalue":"#fff","size":"44rpx"},
|
||||
{"text":"增长","value":"","colortext":"#fff","colorvalue":"","size":"20rpx"},
|
||||
{"text":"down","value":"1.2%","colortext":"#fff","colorvalue":"#fff","size":"20rpx"}
|
||||
]
|
||||
}
|
||||
]
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue