@ -0,0 +1,9 @@
@@ -0,0 +1,9 @@
|
||||
|
||||
# 开发环境配置 |
||||
VITE_APP_ENV = 'development' |
||||
|
||||
#接口地址 |
||||
VITE_APP_API= |
||||
|
||||
#页面基础路径 |
||||
VITE_APP_BASE=/ |
@ -0,0 +1,11 @@
@@ -0,0 +1,11 @@
|
||||
# 生产环境配置 |
||||
VITE_APP_ENV = 'production' |
||||
|
||||
#接口地址 |
||||
VITE_APP_API= |
||||
|
||||
#页面基础路径 |
||||
VITE_APP_BASE=/ |
||||
|
||||
# 是否在打包时开启压缩,支持 gzip 和 brotli |
||||
VITE_BUILD_COMPRESS = gzip |
@ -0,0 +1,21 @@
@@ -0,0 +1,21 @@
|
||||
MIT License |
||||
|
||||
Copyright (c) 2020 smallwei |
||||
|
||||
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. |
@ -1,24 +1,53 @@
@@ -1,24 +1,53 @@
|
||||
# bigscreen-design |
||||
|
||||
## Project setup |
||||
``` |
||||
pnpm install |
||||
``` |
||||
|
||||
### Compiles and hot-reloads for development |
||||
``` |
||||
pnpm run serve |
||||
``` |
||||
|
||||
### Compiles and minifies for production |
||||
``` |
||||
pnpm run build |
||||
``` |
||||
|
||||
### Lints and fixes files |
||||
``` |
||||
pnpm run lint |
||||
``` |
||||
|
||||
### Customize configuration |
||||
See [Configuration Reference](https://cli.vuejs.org/config/). |
||||
|
||||
<h1 align="center"> |
||||
<b> |
||||
<a href="https://godolphinx.org"><img src="https://godolphinx.org/images/dolphin-platform-logo.svg" /></a><br> |
||||
</b> |
||||
</h1> |
||||
|
||||
<p align="center"> A platform for rapid software development </p> |
||||
|
||||
<p align="center"> |
||||
<a href="https://godolphinx.org/"><b>Website</b></a> • |
||||
<a href="https://godolphinx.org/formDesign/description.html"><b>Documentation</b></a> |
||||
</p> |
||||
|
||||
<div align="center"> |
||||
<a href="https://godolphinx.org"> |
||||
<img src="https://img.shields.io/npm/l/vue.svg?sanitize=true"> |
||||
</a> |
||||
<a href="https://gitpod.io/#https://github.com/wangxiang4/dolphin-form-design"> |
||||
<img src="https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod&style=flat-square"> |
||||
</a> |
||||
<a href="https://discord.gg/DREuQWrRYQ"> |
||||
<img src="https://img.shields.io/badge/chat-on%20discord-7289da.svg?sanitize=true"/> |
||||
</a> |
||||
</div> |
||||
|
||||
## 🐬 Description |
||||
Dolphin Ecological Plan-Create a dolphin development platform ecosystem on the web, Android and ios, |
||||
which does not accept any commercialization and is completely free and open source (including advanced functions). |
||||
|
||||
## 💪 Expectation |
||||
Everyone can develop software quickly and efficiently. |
||||
|
||||
## ✨ Feature |
||||
- A vue3 And Typescript based form designer component |
||||
|
||||
## <img width="28" style="vertical-align:middle" src="https://godolphinx.org/images/hacktoberfest-logo.svg"> Hacker Day |
||||
Join [Github HackToberFest](https://hacktoberfest.com/) Start contributing to this project. |
||||
|
||||
## 🤔 Discuss together |
||||
Join [Discord](https://discord.gg/DREuQWrRYQ) Start communicating with everyone. |
||||
|
||||
## 🤗 Become a member of the development team! |
||||
Welcome😀! We are looking for talented developers to join us and make the Dolphin development platform even better! |
||||
If you want to join the development team, please contact us, you are very welcome to join us!💖 |
||||
|
||||
## Online one-click settings |
||||
You can use Gitpod, an online IDE (open source free) to contribute or run examples online. |
||||
|
||||
[](https://gitpod.io/#https://github.com/wangxiang4/dolphin-form-design) |
||||
|
||||
## 📄 Licenses |
||||
[Dolphin Development Platform is MIT licensed](https://github.com/wangxiang4/dolphin-form-design/blob/master/LICENSE) of open source software. |
||||
|
@ -1,5 +0,0 @@
@@ -1,5 +0,0 @@
|
||||
module.exports = { |
||||
presets: [ |
||||
'@vue/cli-plugin-babel/preset' |
||||
] |
||||
} |
@ -0,0 +1,39 @@
@@ -0,0 +1,39 @@
|
||||
<!DOCTYPE html> |
||||
<html lang="en"> |
||||
|
||||
<head> |
||||
<meta charset="UTF-8" /> |
||||
<link rel="icon" href="/favicon.ico" /> |
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> |
||||
<link rel="stylesheet" href="./public/css/loading.css"> |
||||
<link rel="stylesheet" href="./public/cdn/iconfont/iconfont.css"> |
||||
<link rel="stylesheet" href="./public/cdn/animate/3.5.1/animate.css"> |
||||
<script src="./public/components.js"></script> |
||||
<script src="./public/config.js"></script> |
||||
<script src="./public/cdn/html2canvas/html2canvas.min.js"></script> |
||||
<script src="./public/cdn/echarts/5.4.0/echarts.min.js"></script> |
||||
<script src="./public/cdn/echarts-wordcloud.min.js"></script> |
||||
</head> |
||||
|
||||
<body> |
||||
<div id="app"> |
||||
<div class="loading"> |
||||
<div class="loading-wrap"> |
||||
<div class="loading-dots"> |
||||
<span class="dot dot-spin"> |
||||
<i></i> |
||||
<i></i> |
||||
<i></i> |
||||
<i></i> |
||||
</span> |
||||
</div> |
||||
<div class="loading-title"> |
||||
Avue-data |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<script type="module" src="/src/main.js"></script> |
||||
</body> |
||||
|
||||
</html> |
@ -1,19 +0,0 @@
@@ -1,19 +0,0 @@
|
||||
{ |
||||
"compilerOptions": { |
||||
"target": "es5", |
||||
"module": "esnext", |
||||
"baseUrl": "./", |
||||
"moduleResolution": "node", |
||||
"paths": { |
||||
"@/*": [ |
||||
"src/*" |
||||
] |
||||
}, |
||||
"lib": [ |
||||
"esnext", |
||||
"dom", |
||||
"dom.iterable", |
||||
"scripthost" |
||||
] |
||||
} |
||||
} |
@ -1,43 +1,39 @@
@@ -1,43 +1,39 @@
|
||||
{ |
||||
"name": "bigscreen-design", |
||||
"version": "0.1.0", |
||||
"private": true, |
||||
"name": "avue-cli", |
||||
"version": "3.0.0", |
||||
"scripts": { |
||||
"serve": "vue-cli-service serve", |
||||
"build": "vue-cli-service build", |
||||
"lint": "vue-cli-service lint" |
||||
"dev": "vite --host", |
||||
"build": "vite build", |
||||
"serve": "vite preview --host" |
||||
}, |
||||
"dependencies": { |
||||
"core-js": "^3.8.3", |
||||
"vue": "^2.6.14" |
||||
"@element-plus/icons-vue": "^2.0.9", |
||||
"@kjgl77/datav-vue3": "^1.5.0", |
||||
"@smallwei/avue": "^3.2.0", |
||||
"animate.css": "^4.1.1", |
||||
"axios": "0.19.0", |
||||
"crypto-js": "^4.1.1", |
||||
"dayjs": "^1.10.6", |
||||
"element-plus": "^2.2.17", |
||||
"js-cookie": "^3.0.0", |
||||
"mockjs": "^1.1.0", |
||||
"monaco-editor": "^0.34.1", |
||||
"nprogress": "^0.2.0", |
||||
"vite-plugin-mock": "^2.9.4", |
||||
"vue": "^3.2.40", |
||||
"vue-i18n": "^9.1.9", |
||||
"vue-router": "^4.1.5", |
||||
"vue3-sketch-ruler": "^1.3.7", |
||||
"vuedraggable": "^4.1.0", |
||||
"vuex": "^4.0.2" |
||||
}, |
||||
"devDependencies": { |
||||
"@babel/core": "^7.12.16", |
||||
"@babel/eslint-parser": "^7.12.16", |
||||
"@vue/cli-plugin-babel": "~5.0.0", |
||||
"@vue/cli-plugin-eslint": "~5.0.0", |
||||
"@vue/cli-service": "~5.0.0", |
||||
"eslint": "^7.32.0", |
||||
"eslint-plugin-vue": "^8.0.3", |
||||
"vue-template-compiler": "^2.6.14" |
||||
}, |
||||
"eslintConfig": { |
||||
"root": true, |
||||
"env": { |
||||
"node": true |
||||
}, |
||||
"extends": [ |
||||
"plugin:vue/essential", |
||||
"eslint:recommended" |
||||
], |
||||
"parserOptions": { |
||||
"parser": "@babel/eslint-parser" |
||||
}, |
||||
"rules": {} |
||||
}, |
||||
"browserslist": [ |
||||
"> 1%", |
||||
"last 2 versions", |
||||
"not dead" |
||||
] |
||||
"@vitejs/plugin-vue": "^1.3.0", |
||||
"@vue/compiler-sfc": "^3.0.5", |
||||
"sass": "^1.37.5", |
||||
"unplugin-auto-import": "^0.11.2", |
||||
"vite": "^2.4.4", |
||||
"vite-plugin-compression": "^0.5.1", |
||||
"vite-plugin-vue-setup-extend": "^0.4.0" |
||||
} |
||||
} |
||||
|
@ -0,0 +1,167 @@
@@ -0,0 +1,167 @@
|
||||
@font-face { |
||||
font-family: "iconfont"; /* Project id 1117329 */ |
||||
src: url('iconfont.woff2?t=1649215188432') format('woff2'), |
||||
url('iconfont.woff?t=1649215188432') format('woff'), |
||||
url('iconfont.ttf?t=1649215188432') format('truetype'); |
||||
} |
||||
|
||||
.iconfont { |
||||
font-family: "iconfont" !important; |
||||
font-size: 16px; |
||||
font-style: normal; |
||||
-webkit-font-smoothing: antialiased; |
||||
-moz-osx-font-smoothing: grayscale; |
||||
} |
||||
|
||||
.icon-juxing:before { |
||||
content: "\e7a5"; |
||||
} |
||||
|
||||
.icon-datav:before { |
||||
content: "\e722"; |
||||
} |
||||
|
||||
.icon-jianzhuzhuangshi:before { |
||||
content: "\e62d"; |
||||
} |
||||
|
||||
.icon-biankuang:before { |
||||
content: "\e6b7"; |
||||
} |
||||
|
||||
.icon-fold:before { |
||||
content: "\e60a"; |
||||
} |
||||
|
||||
.icon-folder:before { |
||||
content: "\e64f"; |
||||
} |
||||
|
||||
.icon-radar:before { |
||||
content: "\e6cd"; |
||||
} |
||||
|
||||
.icon-scatter:before { |
||||
content: "\e674"; |
||||
} |
||||
|
||||
.icon-funnel:before { |
||||
content: "\e631"; |
||||
} |
||||
|
||||
.icon-slide:before { |
||||
content: "\ea9c"; |
||||
} |
||||
|
||||
.icon-moban:before { |
||||
content: "\e602"; |
||||
} |
||||
|
||||
.icon-daping:before { |
||||
content: "\e675"; |
||||
} |
||||
|
||||
.icon-tabs:before { |
||||
content: "\e62f"; |
||||
} |
||||
|
||||
.icon-event:before { |
||||
content: "\e630"; |
||||
} |
||||
|
||||
.icon-wordCloud:before { |
||||
content: "\e752"; |
||||
} |
||||
|
||||
.icon-video:before { |
||||
content: "\e626"; |
||||
} |
||||
|
||||
.icon-daima:before { |
||||
content: "\e816"; |
||||
} |
||||
|
||||
.icon-peizhi:before { |
||||
content: "\e620"; |
||||
} |
||||
|
||||
.icon-pictorialBar:before { |
||||
content: "\e609"; |
||||
} |
||||
|
||||
.icon-map:before { |
||||
content: "\e601"; |
||||
} |
||||
|
||||
.icon-circle:before { |
||||
content: "\e880"; |
||||
} |
||||
|
||||
.icon-view:before { |
||||
content: "\e60e"; |
||||
} |
||||
|
||||
.icon-build:before { |
||||
content: "\e72d"; |
||||
} |
||||
|
||||
.icon-reset:before { |
||||
content: "\e68b"; |
||||
} |
||||
|
||||
.icon-img:before { |
||||
content: "\e62e"; |
||||
} |
||||
|
||||
.icon-iframe:before { |
||||
content: "\e639"; |
||||
} |
||||
|
||||
.icon-gauge:before { |
||||
content: "\e60c"; |
||||
} |
||||
|
||||
.icon-link:before { |
||||
content: "\e6dc"; |
||||
} |
||||
|
||||
.icon-bar:before { |
||||
content: "\e60d"; |
||||
} |
||||
|
||||
.icon-pie:before { |
||||
content: "\e600"; |
||||
} |
||||
|
||||
.icon-progress:before { |
||||
content: "\e64d"; |
||||
} |
||||
|
||||
.icon-line:before { |
||||
content: "\e608"; |
||||
} |
||||
|
||||
.icon-banner:before { |
||||
content: "\e614"; |
||||
} |
||||
|
||||
.icon-flop:before { |
||||
content: "\e683"; |
||||
} |
||||
|
||||
.icon-scroll:before { |
||||
content: "\e688"; |
||||
} |
||||
|
||||
.icon-table:before { |
||||
content: "\e651"; |
||||
} |
||||
|
||||
.icon-datetime:before { |
||||
content: "\e607"; |
||||
} |
||||
|
||||
.icon-text:before { |
||||
content: "\e605"; |
||||
} |
||||
|
@ -0,0 +1,275 @@
@@ -0,0 +1,275 @@
|
||||
{ |
||||
"id": "1117329", |
||||
"name": "avue-data", |
||||
"font_family": "iconfont", |
||||
"css_prefix_text": "icon-", |
||||
"description": "", |
||||
"glyphs": [ |
||||
{ |
||||
"icon_id": "23043465", |
||||
"name": "矩形树图", |
||||
"font_class": "juxing", |
||||
"unicode": "e7a5", |
||||
"unicode_decimal": 59301 |
||||
}, |
||||
{ |
||||
"icon_id": "2057530", |
||||
"name": "datav-data", |
||||
"font_class": "datav", |
||||
"unicode": "e722", |
||||
"unicode_decimal": 59170 |
||||
}, |
||||
{ |
||||
"icon_id": "688256", |
||||
"name": "建筑装饰", |
||||
"font_class": "jianzhuzhuangshi", |
||||
"unicode": "e62d", |
||||
"unicode_decimal": 58925 |
||||
}, |
||||
{ |
||||
"icon_id": "22761375", |
||||
"name": "边框", |
||||
"font_class": "biankuang", |
||||
"unicode": "e6b7", |
||||
"unicode_decimal": 59063 |
||||
}, |
||||
{ |
||||
"icon_id": "222066", |
||||
"name": "折叠", |
||||
"font_class": "fold", |
||||
"unicode": "e60a", |
||||
"unicode_decimal": 58890 |
||||
}, |
||||
{ |
||||
"icon_id": "749684", |
||||
"name": "文件夹", |
||||
"font_class": "folder", |
||||
"unicode": "e64f", |
||||
"unicode_decimal": 58959 |
||||
}, |
||||
{ |
||||
"icon_id": "2170177", |
||||
"name": "图表-雷达图", |
||||
"font_class": "radar", |
||||
"unicode": "e6cd", |
||||
"unicode_decimal": 59085 |
||||
}, |
||||
{ |
||||
"icon_id": "3408773", |
||||
"name": "散点图", |
||||
"font_class": "scatter", |
||||
"unicode": "e674", |
||||
"unicode_decimal": 58996 |
||||
}, |
||||
{ |
||||
"icon_id": "5094157", |
||||
"name": "漏斗图 (1)", |
||||
"font_class": "funnel", |
||||
"unicode": "e631", |
||||
"unicode_decimal": 58929 |
||||
}, |
||||
{ |
||||
"icon_id": "7754409", |
||||
"name": "slide left right", |
||||
"font_class": "slide", |
||||
"unicode": "ea9c", |
||||
"unicode_decimal": 60060 |
||||
}, |
||||
{ |
||||
"icon_id": "3497472", |
||||
"name": "模板", |
||||
"font_class": "moban", |
||||
"unicode": "e602", |
||||
"unicode_decimal": 58882 |
||||
}, |
||||
{ |
||||
"icon_id": "7955868", |
||||
"name": "大屏", |
||||
"font_class": "daping", |
||||
"unicode": "e675", |
||||
"unicode_decimal": 58997 |
||||
}, |
||||
{ |
||||
"icon_id": "766595", |
||||
"name": "选项卡", |
||||
"font_class": "tabs", |
||||
"unicode": "e62f", |
||||
"unicode_decimal": 58927 |
||||
}, |
||||
{ |
||||
"icon_id": "1659312", |
||||
"name": "交互", |
||||
"font_class": "event", |
||||
"unicode": "e630", |
||||
"unicode_decimal": 58928 |
||||
}, |
||||
{ |
||||
"icon_id": "4152028", |
||||
"name": "组件-字符云", |
||||
"font_class": "wordCloud", |
||||
"unicode": "e752", |
||||
"unicode_decimal": 59218 |
||||
}, |
||||
{ |
||||
"icon_id": "7505631", |
||||
"name": "视频", |
||||
"font_class": "video", |
||||
"unicode": "e626", |
||||
"unicode_decimal": 58918 |
||||
}, |
||||
{ |
||||
"icon_id": "1550488", |
||||
"name": "代码", |
||||
"font_class": "daima", |
||||
"unicode": "e816", |
||||
"unicode_decimal": 59414 |
||||
}, |
||||
{ |
||||
"icon_id": "3531486", |
||||
"name": "配置", |
||||
"font_class": "peizhi", |
||||
"unicode": "e620", |
||||
"unicode_decimal": 58912 |
||||
}, |
||||
{ |
||||
"icon_id": "4657392", |
||||
"name": "象形图", |
||||
"font_class": "pictorialBar", |
||||
"unicode": "e609", |
||||
"unicode_decimal": 58889 |
||||
}, |
||||
{ |
||||
"icon_id": "3647380", |
||||
"name": "地图", |
||||
"font_class": "map", |
||||
"unicode": "e601", |
||||
"unicode_decimal": 58881 |
||||
}, |
||||
{ |
||||
"icon_id": "2059675", |
||||
"name": "环形图", |
||||
"font_class": "circle", |
||||
"unicode": "e880", |
||||
"unicode_decimal": 59520 |
||||
}, |
||||
{ |
||||
"icon_id": "2936158", |
||||
"name": "预览", |
||||
"font_class": "view", |
||||
"unicode": "e60e", |
||||
"unicode_decimal": 58894 |
||||
}, |
||||
{ |
||||
"icon_id": "4214752", |
||||
"name": "生成", |
||||
"font_class": "build", |
||||
"unicode": "e72d", |
||||
"unicode_decimal": 59181 |
||||
}, |
||||
{ |
||||
"icon_id": "6196632", |
||||
"name": "还原", |
||||
"font_class": "reset", |
||||
"unicode": "e68b", |
||||
"unicode_decimal": 59019 |
||||
}, |
||||
{ |
||||
"icon_id": "500969", |
||||
"name": "图片", |
||||
"font_class": "img", |
||||
"unicode": "e62e", |
||||
"unicode_decimal": 58926 |
||||
}, |
||||
{ |
||||
"icon_id": "1237697", |
||||
"name": "iframe", |
||||
"font_class": "iframe", |
||||
"unicode": "e639", |
||||
"unicode_decimal": 58937 |
||||
}, |
||||
{ |
||||
"icon_id": "2083516", |
||||
"name": "仪表盘", |
||||
"font_class": "gauge", |
||||
"unicode": "e60c", |
||||
"unicode_decimal": 58892 |
||||
}, |
||||
{ |
||||
"icon_id": "3182278", |
||||
"name": "超链接", |
||||
"font_class": "link", |
||||
"unicode": "e6dc", |
||||
"unicode_decimal": 59100 |
||||
}, |
||||
{ |
||||
"icon_id": "3422518", |
||||
"name": "柱形图", |
||||
"font_class": "bar", |
||||
"unicode": "e60d", |
||||
"unicode_decimal": 58893 |
||||
}, |
||||
{ |
||||
"icon_id": "3491911", |
||||
"name": "饼图", |
||||
"font_class": "pie", |
||||
"unicode": "e600", |
||||
"unicode_decimal": 58880 |
||||
}, |
||||
{ |
||||
"icon_id": "3775268", |
||||
"name": "进度条", |
||||
"font_class": "progress", |
||||
"unicode": "e64d", |
||||
"unicode_decimal": 58957 |
||||
}, |
||||
{ |
||||
"icon_id": "4381605", |
||||
"name": "折线图", |
||||
"font_class": "line", |
||||
"unicode": "e608", |
||||
"unicode_decimal": 58888 |
||||
}, |
||||
{ |
||||
"icon_id": "4707743", |
||||
"name": "轮播图", |
||||
"font_class": "banner", |
||||
"unicode": "e614", |
||||
"unicode_decimal": 58900 |
||||
}, |
||||
{ |
||||
"icon_id": "4911471", |
||||
"name": "翻牌器", |
||||
"font_class": "flop", |
||||
"unicode": "e683", |
||||
"unicode_decimal": 59011 |
||||
}, |
||||
{ |
||||
"icon_id": "4911480", |
||||
"name": "跑马灯", |
||||
"font_class": "scroll", |
||||
"unicode": "e688", |
||||
"unicode_decimal": 59016 |
||||
}, |
||||
{ |
||||
"icon_id": "6291818", |
||||
"name": "表格", |
||||
"font_class": "table", |
||||
"unicode": "e651", |
||||
"unicode_decimal": 58961 |
||||
}, |
||||
{ |
||||
"icon_id": "6417244", |
||||
"name": "时间", |
||||
"font_class": "datetime", |
||||
"unicode": "e607", |
||||
"unicode_decimal": 58887 |
||||
}, |
||||
{ |
||||
"icon_id": "7732218", |
||||
"name": "文本", |
||||
"font_class": "text", |
||||
"unicode": "e605", |
||||
"unicode_decimal": 58885 |
||||
} |
||||
] |
||||
} |
@ -0,0 +1,47 @@
@@ -0,0 +1,47 @@
|
||||
const testComponents = { |
||||
template: ` |
||||
<div :style="[styleSizeName,styleName]" |
||||
:class="className"> |
||||
<div :style="styleChartName"> |
||||
<h2>自定义组件</h2><br /> |
||||
<h3>我是参数:{{dataParams}}</h3><br /> |
||||
<h3>data:{{dataChart}}</h3><br /> |
||||
<h3>params:{{dataAxios.config}}</h3><br /> |
||||
</div> |
||||
</div> |
||||
`,
|
||||
name: 'test', |
||||
props: { |
||||
option: Object, |
||||
component: Object |
||||
}, |
||||
computed: { |
||||
styleName () { |
||||
return { |
||||
fontSize: this.fontSize, |
||||
color: this.color |
||||
} |
||||
}, |
||||
color () { |
||||
return this.option.color || '#fff' |
||||
}, |
||||
fontSize () { |
||||
return (this.option.fontSize || 30) + 'px' |
||||
} |
||||
} |
||||
} |
||||
|
||||
const testOption = { |
||||
template: ` |
||||
<div> |
||||
<el-form-item label="字体大小"> |
||||
<avue-input-number v-model="main.activeOption.fontSize"></avue-input-number> |
||||
</el-form-item> |
||||
<el-form-item label="字体颜色"> |
||||
<avue-input-color v-model="main.activeOption.color"></avue-input-color> |
||||
</el-form-item> |
||||
</div> |
||||
`,
|
||||
name: 'test', |
||||
inject: ["main"] |
||||
} |
@ -0,0 +1,116 @@
@@ -0,0 +1,116 @@
|
||||
.loading { |
||||
display: flex; |
||||
width: 100%; |
||||
height: 100%; |
||||
justify-content: center; |
||||
align-items: center; |
||||
flex-direction: column; |
||||
background-color: #f4f7f9 |
||||
} |
||||
|
||||
.loading .loading-wrap { |
||||
position: absolute; |
||||
top: 50%; |
||||
left: 50%; |
||||
display: flex; |
||||
-webkit-transform: translate3d(-50%, -50%, 0); |
||||
transform: translate3d(-50%, -50%, 0); |
||||
justify-content: center; |
||||
align-items: center; |
||||
flex-direction: column |
||||
} |
||||
|
||||
.loading .dots { |
||||
display: flex; |
||||
padding: 98px; |
||||
justify-content: center; |
||||
align-items: center |
||||
} |
||||
|
||||
.loading .loading-title { |
||||
display: flex; |
||||
font-weight: bold; |
||||
margin-top: 30px; |
||||
font-size: 36px; |
||||
color: rgba(0, 0, 0, .85); |
||||
justify-content: center; |
||||
align-items: center |
||||
} |
||||
|
||||
|
||||
.dot { |
||||
position: relative; |
||||
display: inline-block; |
||||
width: 48px; |
||||
height: 48px; |
||||
margin-top: 30px; |
||||
font-size: 32px; |
||||
transform: rotate(45deg); |
||||
box-sizing: border-box; |
||||
animation: antRotate 1.2s infinite linear |
||||
} |
||||
|
||||
.dot i { |
||||
position: absolute; |
||||
display: block; |
||||
width: 20px; |
||||
height: 20px; |
||||
background-color: #0065cc; |
||||
border-radius: 100%; |
||||
opacity: .3; |
||||
transform: scale(.75); |
||||
animation: antSpinMove 1s infinite linear alternate; |
||||
transform-origin: 50% 50% |
||||
} |
||||
|
||||
.dot i:nth-child(1) { |
||||
top: 0; |
||||
left: 0 |
||||
} |
||||
|
||||
.dot i:nth-child(2) { |
||||
top: 0; |
||||
right: 0; |
||||
-webkit-animation-delay: .4s; |
||||
animation-delay: .4s |
||||
} |
||||
|
||||
.dot i:nth-child(3) { |
||||
right: 0; |
||||
bottom: 0; |
||||
-webkit-animation-delay: .8s; |
||||
animation-delay: .8s |
||||
} |
||||
|
||||
.dot i:nth-child(4) { |
||||
bottom: 0; |
||||
left: 0; |
||||
-webkit-animation-delay: 1.2s; |
||||
animation-delay: 1.2s |
||||
} |
||||
|
||||
@keyframes antRotate { |
||||
to { |
||||
-webkit-transform: rotate(405deg); |
||||
transform: rotate(405deg) |
||||
} |
||||
} |
||||
|
||||
@-webkit-keyframes antRotate { |
||||
to { |
||||
-webkit-transform: rotate(405deg); |
||||
transform: rotate(405deg) |
||||
} |
||||
} |
||||
|
||||
@keyframes antSpinMove { |
||||
to { |
||||
opacity: 1 |
||||
} |
||||
} |
||||
|
||||
@-webkit-keyframes antSpinMove { |
||||
to { |
||||
opacity: 1 |
||||
} |
||||
} |
Before Width: | Height: | Size: 4.2 KiB |
After Width: | Height: | Size: 4.1 KiB |
After Width: | Height: | Size: 24 KiB |
After Width: | Height: | Size: 220 KiB |
After Width: | Height: | Size: 2.0 KiB |
After Width: | Height: | Size: 2.4 KiB |
After Width: | Height: | Size: 3.6 KiB |
After Width: | Height: | Size: 3.0 KiB |
After Width: | Height: | Size: 2.1 KiB |
After Width: | Height: | Size: 9.0 KiB |
After Width: | Height: | Size: 15 KiB |
After Width: | Height: | Size: 4.7 KiB |
After Width: | Height: | Size: 6.4 KiB |
After Width: | Height: | Size: 12 KiB |
After Width: | Height: | Size: 3.5 KiB |
After Width: | Height: | Size: 40 KiB |
After Width: | Height: | Size: 51 KiB |
After Width: | Height: | Size: 67 KiB |
After Width: | Height: | Size: 1.1 MiB |
After Width: | Height: | Size: 37 KiB |
After Width: | Height: | Size: 2.8 KiB |
After Width: | Height: | Size: 128 KiB |
After Width: | Height: | Size: 12 KiB |
After Width: | Height: | Size: 30 KiB |
After Width: | Height: | Size: 7.1 KiB |
After Width: | Height: | Size: 3.5 KiB |
After Width: | Height: | Size: 20 KiB |
After Width: | Height: | Size: 2.0 KiB |
After Width: | Height: | Size: 1.8 KiB |
After Width: | Height: | Size: 67 KiB |
After Width: | Height: | Size: 1.8 KiB |
After Width: | Height: | Size: 3.5 KiB |
After Width: | Height: | Size: 39 KiB |
After Width: | Height: | Size: 3.2 KiB |
After Width: | Height: | Size: 7.7 KiB |
After Width: | Height: | Size: 7.2 KiB |
After Width: | Height: | Size: 11 KiB |
After Width: | Height: | Size: 5.1 KiB |
After Width: | Height: | Size: 4.2 KiB |
After Width: | Height: | Size: 5.1 KiB |
After Width: | Height: | Size: 8.9 KiB |
After Width: | Height: | Size: 18 KiB |
After Width: | Height: | Size: 41 KiB |
After Width: | Height: | Size: 8.4 KiB |
After Width: | Height: | Size: 6.4 KiB |
After Width: | Height: | Size: 2.6 KiB |
After Width: | Height: | Size: 10 KiB |
After Width: | Height: | Size: 19 KiB |
After Width: | Height: | Size: 5.7 KiB |
After Width: | Height: | Size: 6.3 KiB |
After Width: | Height: | Size: 7.1 KiB |
After Width: | Height: | Size: 212 KiB |
After Width: | Height: | Size: 14 KiB |
After Width: | Height: | Size: 7.3 KiB |
After Width: | Height: | Size: 4.7 KiB |
After Width: | Height: | Size: 3.9 KiB |
After Width: | Height: | Size: 8.3 KiB |
After Width: | Height: | Size: 4.2 KiB |
After Width: | Height: | Size: 4.8 KiB |
After Width: | Height: | Size: 11 KiB |
After Width: | Height: | Size: 7.3 KiB |
After Width: | Height: | Size: 2.7 KiB |
After Width: | Height: | Size: 33 KiB |
After Width: | Height: | Size: 29 KiB |
After Width: | Height: | Size: 18 KiB |
After Width: | Height: | Size: 1.6 KiB |
After Width: | Height: | Size: 49 KiB |
After Width: | Height: | Size: 16 KiB |
After Width: | Height: | Size: 8.8 KiB |
After Width: | Height: | Size: 392 B |
After Width: | Height: | Size: 1.9 KiB |
After Width: | Height: | Size: 1.8 KiB |
After Width: | Height: | Size: 2.2 KiB |
After Width: | Height: | Size: 1.8 KiB |
After Width: | Height: | Size: 9.6 KiB |