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

Merge remote-tracking branch 'origin/develop'

Browse Source 
Former-commit-id: 86a318d4dad8519b58321602de578639a951ba16 [formerly c801253482d6a74b316cffc808beb1c594a4916a] [formerly 86a318d4dad8519b58321602de578639a951ba16 [formerly c801253482d6a74b316cffc808beb1c594a4916a] [formerly 86a318d4dad8519b58321602de578639a951ba16 [formerly c801253482d6a74b316cffc808beb1c594a4916a] [formerly c801253482d6a74b316cffc808beb1c594a4916a [formerly 4481a2633c24941ee1a49112d0a671e3910ccd75 [formerly 22e0a759bdea9e9e4fe7a50cb72fb9427a112595]]]]]
Former-commit-id: 404fb2bc0ac72617255d763cf0e79f3c8bb75d22
Former-commit-id: af69ee921db37fe35f1e983cb9c81b0a33f04eae
Former-commit-id: 07cdd7cf684c81b4a1b41ec0b186afe1b2ddadae [formerly 2c36d5440edb9d11a798f3e87cffb8f1d6459c0a]
Former-commit-id: 303635dafc4b4b02dab144a2f6f293aed6f4e664
Former-commit-id: 423c98a6553fe1e9674539899dfc3f218c92ac55
Former-commit-id: 0dccc5084f39e92950f9343f41594d322eeacb90
Former-commit-id: d5785094ea30d1cf15d7b94a81a4e5447297a875
Former-commit-id: d58b4ec6c677b03e8c9ef7752a6cceb4f87a26f5
This commit is contained in:
liyang
2018-09-19 11:12:11 +08:00
parent 9c48c30530 8e193be379
commit 8c7e95c075
13 changed files with 522 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@@ -12,7 +12,7 @@
"test:unit": "vue-cli-service test:unit"
},
"dependencies": {
"@d2-projects/d2-crud": "^1.1.0",
"@d2-projects/d2-crud": "^1.2.0",
"axios": "^0.17.1",
"babel-polyfill": "^6.26.0",
"better-scroll": "^1.12.1",

3
src/menu/modules/demo-d2-crud.js
View File

@@ -8,6 +8,8 @@ export default {
title: '基础功能',
children: [
{ path: `${pre}demo1`, title: '基础表格' },
{ path: `${pre}demo27`, title: '加载状态' },
{ path: `${pre}demo28`, title: '自定义加载状态' },
{ path: `${pre}demo2`, title: '带斑马纹表格' },
{ path: `${pre}demo3`, title: '带边框表格' },
{ path: `${pre}demo4`, title: '带状态表格' },
@@ -28,6 +30,7 @@ export default {
{
title: '数据操作',
children: [
{ path: `${pre}demo29`, title: '分页' },
{ path: `${pre}demo16`, title: '新增数据' },
{ path: `${pre}demo17`, title: '修改数据' },
{ path: `${pre}demo18`, title: '删除数据' },

54
src/pages/demo/d2-crud/demo27/code.js Normal file
View File

@@ -0,0 +1,54 @@
export default `<template>
<div>
<d2-crud
:columns="columns"
:data="data"
:loading="loading"/>
</div>
</template>
<script>
export default {
data () {
return {
columns: [
{
title: '日期',
key: 'date'
},
{
title: '姓名',
key: 'name'
},
{
title: '地址',
key: 'address'
}
],
data: [
{
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
},
{
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄'
},
{
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
},
{
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄'
}
],
loading: true
}
}
}
</script>`

1
src/pages/demo/d2-crud/demo27/doc.md Normal file
View File

@@ -0,0 +1 @@
在 `D2 Crud` 组件中传入 `loading` ，即可控制表格加载状态，`loading` 的可选值为 `true` 和 `false`。代码如下：

76
src/pages/demo/d2-crud/demo27/index.vue Normal file
View File

@@ -0,0 +1,76 @@
<template>
<d2-container>
<template slot="header">加载状态</template>
<el-button @click="handleLoading">点我切换加载状态</el-button>
<d2-crud
style="margin-top: 10px"
:columns="columns"
:data="data"
:loading="loading"/>
<el-card shadow="never" class="d2-mb">
<d2-markdown :source="doc"/>
</el-card>
<el-card shadow="never" class="d2-mb">
<d2-highlight :code="code"/>
</el-card>
<template slot="footer">
<d2-link-btn title="文档" link="https://d2-projects.github.io/d2-admin-doc/zh/ecosystem-d2-crud/"/>
</template>
</d2-container>
</template>
<script>
import doc from './doc.md'
import code from './code.js'
export default {
data () {
return {
doc,
code,
columns: [
{
title: '日期',
key: 'date'
},
{
title: '姓名',
key: 'name'
},
{
title: '地址',
key: 'address'
}
],
data: [
{
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
},
{
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄'
},
{
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
},
{
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄'
}
],
loading: true
}
},
methods: {
handleLoading () {
this.loading = !this.loading
}
}
}
</script>

60
src/pages/demo/d2-crud/demo28/code.js Normal file
View File

@@ -0,0 +1,60 @@
export default `<template>
<div>
<d2-crud
:columns="columns"
:data="data"
:loading="loading"
:loading-options="loadingOptions"/>
</div>
</template>
<script>
export default {
data () {
return {
columns: [
{
title: '日期',
key: 'date'
},
{
title: '姓名',
key: 'name'
},
{
title: '地址',
key: 'address'
}
],
data: [
{
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
},
{
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄'
},
{
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
},
{
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄'
}
],
loading: true,
loadingOptions: {
text: '拼命加载中',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.8)'
}
}
}
}
</script>`

1
src/pages/demo/d2-crud/demo28/doc.md Normal file
View File

@@ -0,0 +1 @@
在 `D2 Crud` 组件中传入 `loading-options` ，即可自定义表格加载状态。代码如下：

82
src/pages/demo/d2-crud/demo28/index.vue Normal file
View File

@@ -0,0 +1,82 @@
<template>
<d2-container>
<template slot="header">自定义加载状态</template>
<el-button @click="handleLoading">点我切换加载状态</el-button>
<d2-crud
style="margin-top: 10px"
:columns="columns"
:data="data"
:loading="loading"
:loading-options="loadingOptions"/>
<el-card shadow="never" class="d2-mb">
<d2-markdown :source="doc"/>
</el-card>
<el-card shadow="never" class="d2-mb">
<d2-highlight :code="code"/>
</el-card>
<template slot="footer">
<d2-link-btn title="文档" link="https://d2-projects.github.io/d2-admin-doc/zh/ecosystem-d2-crud/"/>
</template>
</d2-container>
</template>
<script>
import doc from './doc.md'
import code from './code.js'
export default {
data () {
return {
doc,
code,
columns: [
{
title: '日期',
key: 'date'
},
{
title: '姓名',
key: 'name'
},
{
title: '地址',
key: 'address'
}
],
data: [
{
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
},
{
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄'
},
{
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
},
{
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄'
}
],
loading: true,
loadingOptions: {
text: '拼命加载中',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.8)'
}
}
},
methods: {
handleLoading () {
this.loading = !this.loading
}
}
}
</script>

113
src/pages/demo/d2-crud/demo29/code.js Normal file
View File

@@ -0,0 +1,113 @@
export default `<template>
<div>
<d2-crud
:columns="columns"
:data="data"
:pagination="pagination"/>
</div>
</template>
<script>
export default {
data () {
return {
columns: [
{
title: 'ID',
key: 'id'
},
{
title: '日期',
key: 'date'
},
{
title: '姓名',
key: 'name'
},
{
title: '地址',
key: 'address'
}
],
data: [
{
id: 1,
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
},
{
id: 2,
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄'
},
{
id: 3,
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
},
{
id: 4,
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄'
},
{
id: 5,
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
},
{
id: 6,
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄'
},
{
id: 7,
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
},
{
id: 8,
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄'
},
{
id: 9,
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
},
{
id: 10,
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄'
},
{
id: 11,
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
},
{
id: 12,
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄'
}
],
pagination: {
pageSize: 5,
layout: 'prev, pager, next, total'
}
}
}
}
</script>`

1
src/pages/demo/d2-crud/demo29/doc.md Normal file
View File

@@ -0,0 +1 @@
在 `D2 Crud` 组件中传入 `pagination` 对象，即可开启分页。代码如下：

128
src/pages/demo/d2-crud/demo29/index.vue Normal file
View File

@@ -0,0 +1,128 @@
<template>
<d2-container>
<template slot="header">分页</template>
<d2-crud
:columns="columns"
:data="data"
:pagination="pagination"/>
<el-card shadow="never" class="d2-mb">
<d2-markdown :source="doc"/>
</el-card>
<el-card shadow="never" class="d2-mb">
<d2-highlight :code="code"/>
</el-card>
<template slot="footer">
<d2-link-btn title="文档" link="https://d2-projects.github.io/d2-admin-doc/zh/ecosystem-d2-crud/"/>
</template>
</d2-container>
</template>
<script>
import doc from './doc.md'
import code from './code.js'
export default {
data () {
return {
doc,
code,
columns: [
{
title: 'ID',
key: 'id'
},
{
title: '日期',
key: 'date'
},
{
title: '姓名',
key: 'name'
},
{
title: '地址',
key: 'address'
}
],
data: [
{
id: 1,
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
},
{
id: 2,
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄'
},
{
id: 3,
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
},
{
id: 4,
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄'
},
{
id: 5,
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
},
{
id: 6,
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄'
},
{
id: 7,
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
},
{
id: 8,
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄'
},
{
id: 9,
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
},
{
id: 10,
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄'
},
{
id: 11,
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
},
{
id: 12,
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄'
}
],
pagination: {
pageSize: 5,
layout: 'prev, pager, next, total'
}
}
}
}
</script>

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

@@ -1 +1 @@
c62802e4146a602e5c498cdb99205b56768d4047
b2bf5f06d7bc6fbdb1464a1eea0e2eae737ea6af

2
yarn.lock.REMOVED.git-id
View File

@@ -1 +1 @@
98d7a73c1fb484dbcca94b8f6a41f916b8a30c20
9f0de1b1283741f3ab3b7a925f9b96808cfb51e5