sheng/mes-ui-d2
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

no message

Browse Source 
Former-commit-id: 0a49e22e5a531c2df8fa90244bedb6e0ac4297c6 [formerly 0a49e22e5a531c2df8fa90244bedb6e0ac4297c6 [formerly 0a49e22e5a531c2df8fa90244bedb6e0ac4297c6 [formerly 0a49e22e5a531c2df8fa90244bedb6e0ac4297c6 [formerly a570816c9de27ef7bc3b80c1cd5bb8bd0f2c9c13 [formerly 39ab0a504140b305df41c0d209d913079d210ef7]]]]]
Former-commit-id: 7a56aafdafea6ee6ffd2b046959b88c471eaab15
Former-commit-id: 7466b6ec8a35116a499addb8630047ca7576bacc
Former-commit-id: 98b9f572a6b21a6ee02483794ecd0dd0cf6873b3 [formerly 8bbac95c8d9e75c185affb7e7a6f1fddc7cc6ed5]
Former-commit-id: c3909adc020a418579d7b3a2034689bba0e35593
Former-commit-id: 35cf98c0c012ee69dad83556f6654ab074730d9b
Former-commit-id: ce8623ae25b423c26062e738d0df9276bee3c387
Former-commit-id: 214996c73a86f6b46d2414225b6660358f585946
Former-commit-id: fe121e22a74d82a43357212cd157c01eeda108e5
This commit is contained in:
liyang
2018-06-27 00:48:46 +08:00
parent 6e42a0aa9d
commit 16ddbb4288
14 changed files with 261 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
design.sketch.REMOVED.git-id
View File

@@ -1 +1 @@
59cc75ac4ddfd1c2192b1543df281217eb5d77bf
4bcd95302c6d5c8ed1e44b96e2ba6978b84bea68

2
package.json
View File

@@ -19,6 +19,7 @@
"clipboard-polyfill": "^2.4.1",
"countup.js": "^1.9.3",
"dayjs": "^1.6.7",
"echarts": "^4.1.0",
"element-ui": "^2.0.11",
"file-saver": "^1.3.3",
"github-markdown-css": "^2.10.0",
@@ -34,6 +35,7 @@
"path-posix": "^1.0.0",
"quill": "^1.3.4",
"simplemde": "^1.11.2",
"v-charts": "^1.17.6",
"v-contextmenu": "^2.7.0",
"vue": "^2.5.2",
"vue-grid-layout": "^2.1.11",

1
src/components/core/d2-container/components/d2-container-full.vue
View File

@@ -38,6 +38,7 @@ export default {
flex-grow: 1;
padding: 20px;
overflow: auto;
position: relative;
}
.d2-container-full__footer {
padding: 20px;

4
src/components/demo/register.js
View File

@@ -1,5 +1,7 @@
import Vue from 'vue'
Vue.component('d2-demo-link-btn', () => import('@/components/demo/d2-demo-link-btn'))
import d2DemoLinkBtn from '@/components/demo/d2-demo-link-btn'
Vue.component('d2-demo-link-btn', d2DemoLinkBtn)
Vue.component('d2-demo-page-header', () => import('@/components/demo/d2-demo-page-header'))
Vue.component('d2-demo-page-cover', () => import('@/components/demo/d2-demo-page-cover'))

4
src/main.js
View File

@@ -8,6 +8,9 @@ import i18n from './i18n'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
// v-charts
import VCharts from 'v-charts'
// font-awesome
import '@/assets/library/font-awesome-4.7.0/css/font-awesome.min.css'
@@ -53,6 +56,7 @@ import bigdataTable from '@/plugin/vue-bigdata-table'
import buildConfig from '../config/index'
Vue.use(ElementUI)
Vue.use(VCharts)
Vue.use(contentmenu)
Vue.use(pluginImport)

30
src/menu/index.js
View File

@@ -116,11 +116,37 @@ const demoComponents = {
])('/demo/components/')
}
// 路由菜单 组件
const demoCharts = {
path: '/demo/charts',
title: '图表',
icon: 'line-chart',
children: (pre => [
{ path: `${pre}index`, title: '图表首页' },
{
path: `${pre}list`,
title: '图表',
children: [
{
path: `${pre}list/line`,
title: '折线图',
children: [
{ path: `${pre}list/line/demo1`, title: '示例' },
{ path: `${pre}list/line/demo2`, title: '横坐标的倾斜' },
{ path: `${pre}list/line/demo3`, title: '堆叠面积图' },
{ path: `${pre}list/line/demo4`, title: '显示指标数值' }
]
}
]
}
])('/demo/charts/')
}
// 路由菜单 组件库
const demoElement = {
path: '/demo/element',
title: 'Element 组件库',
icon: 'puzzle-piece',
icon: 'cubes',
children: (pre => [
{ path: `${pre}index`, title: '组件库首页' },
{
@@ -210,6 +236,7 @@ const demoElement = {
export const side = [
demoPlugins,
demoComponents,
demoCharts,
demoElement
]
@@ -225,6 +252,7 @@ export default [
children: [
demoPlugins,
demoComponents,
demoCharts,
demoElement,
{
title: '空菜单演示',

9
src/pages/demo/charts/index/index.vue Normal file
View File

@@ -0,0 +1,9 @@
<template>
<d2-container type="full">
<d2-demo-page-cover
title="图表"
sub-title="集成图表组件">
<img :src="`${$assetsPublicPath}static/image/icon/500/charts.png`">
</d2-demo-page-cover>
</d2-container>
</template>

9
src/pages/demo/charts/list/_mixin/list.js Normal file
View File

@@ -0,0 +1,9 @@
export default {
data () {
return {
pubSetting: {
height: '100%'
}
}
}
}

45
src/pages/demo/charts/list/line/demo1/index.vue Normal file
View File

@@ -0,0 +1,45 @@
<template>
<d2-container type="full">
<template slot="header">示例</template>
<div class="inner">
<ve-line :data="chartData" v-bind="pubSetting"></ve-line>
</div>
<template slot="footer">
<d2-demo-link-btn title="更多示例和文档" link="https://v-charts.js.org"/>
</template>
</d2-container>
</template>
<script>
import list from '@/pages/demo/charts/list/_mixin/list.js'
export default {
mixins: [
list
],
data: function () {
return {
chartData: {
columns: ['日期', '访问用户', '下单用户', '下单率'],
rows: [
{ '日期': '1/1', '访问用户': 1393, '下单用户': 1093, '下单率': 0.32 },
{ '日期': '1/2', '访问用户': 3530, '下单用户': 3230, '下单率': 0.26 },
{ '日期': '1/3', '访问用户': 2923, '下单用户': 2623, '下单率': 0.76 },
{ '日期': '1/4', '访问用户': 1723, '下单用户': 1423, '下单率': 0.49 },
{ '日期': '1/5', '访问用户': 3792, '下单用户': 3492, '下单率': 0.323 },
{ '日期': '1/6', '访问用户': 4593, '下单用户': 4293, '下单率': 0.78 }
]
}
}
}
}
</script>
<style lang="scss" scoped>
.inner {
position: absolute;
top: 20px;
right: 20px;
bottom: 20px;
left: 20px;
}
</style>

54
src/pages/demo/charts/list/line/demo2/index.vue Normal file
View File

@@ -0,0 +1,54 @@
<template>
<d2-container type="full">
<template slot="header">横坐标的倾斜</template>
<div class="inner">
<ve-line :data="chartData" :extend="extend" v-bind="pubSetting"></ve-line>
</div>
<template slot="footer">
<d2-demo-link-btn title="更多示例和文档" link="https://v-charts.js.org"/>
</template>
</d2-container>
</template>
<script>
import list from '@/pages/demo/charts/list/_mixin/list.js'
export default {
mixins: [
list
],
data: function () {
this.extend = {
'xAxis.0.axisLabel.rotate': 45
}
return {
chartData: {
columns: ['日期', '访问用户', '下单用户', '下单率'],
rows: [
{ '日期': '1/1', '访问用户': 1393, '下单用户': 1093, '下单率': 0.32 },
{ '日期': '1/2', '访问用户': 3530, '下单用户': 3230, '下单率': 0.26 },
{ '日期': '1/3', '访问用户': 2923, '下单用户': 2623, '下单率': 0.76 },
{ '日期': '1/4', '访问用户': 1723, '下单用户': 1423, '下单率': 0.49 },
{ '日期': '1/5', '访问用户': 3792, '下单用户': 3492, '下单率': 0.323 },
{ '日期': '1/6', '访问用户': 4593, '下单用户': 4293, '下单率': 0.78 },
{ '日期': '1/7', '访问用户': 1393, '下单用户': 1093, '下单率': 0.32 },
{ '日期': '1/8', '访问用户': 3530, '下单用户': 3230, '下单率': 0.26 },
{ '日期': '1/9', '访问用户': 2923, '下单用户': 2623, '下单率': 0.76 },
{ '日期': '1/10', '访问用户': 1723, '下单用户': 1423, '下单率': 0.49 },
{ '日期': '1/11', '访问用户': 3792, '下单用户': 3492, '下单率': 0.323 },
{ '日期': '1/12', '访问用户': 4593, '下单用户': 4293, '下单率': 0.78 }
]
}
}
}
}
</script>
<style lang="scss" scoped>
.inner {
position: absolute;
top: 20px;
right: 20px;
bottom: 20px;
left: 20px;
}
</style>

49
src/pages/demo/charts/list/line/demo3/index.vue Normal file
View File

@@ -0,0 +1,49 @@
<template>
<d2-container type="full">
<template slot="header">堆叠面积图</template>
<div class="inner">
<ve-line :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-line>
</div>
<template slot="footer">
<d2-demo-link-btn title="更多示例和文档" link="https://v-charts.js.org"/>
</template>
</d2-container>
</template>
<script>
import list from '@/pages/demo/charts/list/_mixin/list.js'
export default {
mixins: [
list
],
data () {
this.chartSettings = {
stack: { '用户': ['访问用户', '下单用户'] },
area: true
}
return {
chartData: {
columns: ['日期', '访问用户', '下单用户', '下单率'],
rows: [
{ '日期': '1/1', '访问用户': 1393, '下单用户': 1093, '下单率': 0.32 },
{ '日期': '1/2', '访问用户': 3530, '下单用户': 3230, '下单率': 0.26 },
{ '日期': '1/3', '访问用户': 2923, '下单用户': 2623, '下单率': 0.76 },
{ '日期': '1/4', '访问用户': 1723, '下单用户': 1423, '下单率': 0.49 },
{ '日期': '1/5', '访问用户': 3792, '下单用户': 3492, '下单率': 0.323 },
{ '日期': '1/6', '访问用户': 4593, '下单用户': 4293, '下单率': 0.78 }
]
}
}
}
}
</script>
<style lang="scss" scoped>
.inner {
position: absolute;
top: 20px;
right: 20px;
bottom: 20px;
left: 20px;
}
</style>

54
src/pages/demo/charts/list/line/demo4/index.vue Normal file
View File

@@ -0,0 +1,54 @@
<template>
<d2-container type="full">
<template slot="header">显示指标数值</template>
<div class="inner">
<ve-line :data="chartData" :extend="extend" v-bind="pubSetting"></ve-line>
</div>
<template slot="footer">
<d2-demo-link-btn title="更多示例和文档" link="https://v-charts.js.org"/>
</template>
</d2-container>
</template>
<script>
import list from '@/pages/demo/charts/list/_mixin/list.js'
export default {
mixins: [
list
],
data () {
this.extend = {
series: {
label: {
normal: {
show: true
}
}
}
}
return {
chartData: {
columns: ['日期', '访问用户', '下单用户', '下单率'],
rows: [
{ '日期': '1/1', '访问用户': 1393, '下单用户': 1093, '下单率': 0.32 },
{ '日期': '1/2', '访问用户': 3530, '下单用户': 3230, '下单率': 0.26 },
{ '日期': '1/3', '访问用户': 2923, '下单用户': 2623, '下单率': 0.76 },
{ '日期': '1/4', '访问用户': 1723, '下单用户': 1423, '下单率': 0.49 },
{ '日期': '1/5', '访问用户': 3792, '下单用户': 3492, '下单率': 0.323 },
{ '日期': '1/6', '访问用户': 4593, '下单用户': 4293, '下单率': 0.78 }
]
}
}
}
}
</script>
<style lang="scss" scoped>
.inner {
position: absolute;
top: 20px;
right: 20px;
bottom: 20px;
left: 20px;
}
</style>

2
src/router/index.js.REMOVED.git-id
View File

@@ -1 +1 @@
89e063c3ddd8c257b9e34b7c88bc6d39efbc4ad5
75041a6a688f975cc1b62327c7bb6c7fa8358afc

0
static/image/icon/500/chart.png.REMOVED.git-id → static/image/icon/500/charts.png.REMOVED.git-id
View File