Merge branch 'release/v1.1.6'
Former-commit-id: f1780b48ac3417478c4dd35ab2ea43ca495b3a33 [formerly f1780b48ac3417478c4dd35ab2ea43ca495b3a33 [formerly f1780b48ac3417478c4dd35ab2ea43ca495b3a33 [formerly f1780b48ac3417478c4dd35ab2ea43ca495b3a33 [formerly 77cd1a005be35cd9c34a3258dd722142437bf74f [formerly e99f62e7c35bcf3b15a7dca0d208a4a0d4b440f7]]]]] Former-commit-id: 7348ae2f187ab5518cf7076a1b2f8b802f0144c6 Former-commit-id: b005dfcbc08d7ff24c6e598d9e21d2df5e38d328 Former-commit-id: 5afdaafe8c09a772b52b120047b7d232c857dd2a [formerly 22e052cdff9318f6f336ad7a4b755a00803bcf43] Former-commit-id: 57608bf479a46bf810a9c17f117a299497d2d442 Former-commit-id: b12f96ab0dc35bd57b608e6bce36587166d25b48 Former-commit-id: af538030b5a08453ec8f58ba0a74622bed9d1f1f Former-commit-id: 72a0d3bb3ed4e52b8b1553c5d6e9d35e9aa93021 Former-commit-id: 32ef0ebdc48e866afe9cd8ea4f7175cc53a12927
This commit is contained in:
@@ -52,7 +52,7 @@ module.exports = {
|
|||||||
'/zh/guide/': sideBarGuide('指南'),
|
'/zh/guide/': sideBarGuide('指南'),
|
||||||
'/zh/plugins/': sideBarPlugins('插件'),
|
'/zh/plugins/': sideBarPlugins('插件'),
|
||||||
'/zh/components/': sideBarComponents('组件'),
|
'/zh/components/': sideBarComponents('组件'),
|
||||||
'/zh/article/': sideBarArticle('版本更新'),
|
'/zh/article/': sideBarArticle('Cookbook', '版本更新'),
|
||||||
'/zh/others/': sideBarOthers('其它')
|
'/zh/others/': sideBarOthers('其它')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -109,13 +109,20 @@ function sideBarComponents (title) {
|
|||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|
||||||
function sideBarArticle (titleUpdate) {
|
function sideBarArticle (titleCookBook, titleUpdate) {
|
||||||
return [
|
return [
|
||||||
|
{
|
||||||
|
title: titleCookBook,
|
||||||
|
collapsable: false,
|
||||||
|
children: [
|
||||||
|
'cookbook/what-is-cookbook',
|
||||||
|
'cookbook/combinable-questionnaire',
|
||||||
|
]
|
||||||
|
},
|
||||||
{
|
{
|
||||||
title: titleUpdate,
|
title: titleUpdate,
|
||||||
collapsable: false,
|
collapsable: false,
|
||||||
children: [
|
children: [
|
||||||
'',
|
|
||||||
'update/1.1.5',
|
'update/1.1.5',
|
||||||
'update/1.1.4',
|
'update/1.1.4',
|
||||||
'update/0.0.0'
|
'update/0.0.0'
|
||||||
|
|||||||
@@ -1,3 +1,3 @@
|
|||||||
# 章节介绍
|
# 文章
|
||||||
|
|
||||||
这个章节下收录关于 D2Admin 的一些介绍,用法,以及每次发布新版本时的推广文章,也是每篇新文章的首发地址。
|
请在侧边栏目录选择文章阅读
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
19d478d2f8f1eaf254a2f27de23d407916d28d0d
|
||||||
3
docs/zh/article/cookbook/what-is-cookbook.md
Normal file
3
docs/zh/article/cookbook/what-is-cookbook.md
Normal file
@@ -0,0 +1,3 @@
|
|||||||
|
# 什么是 Cookbook
|
||||||
|
|
||||||
|
计算机领域的 Cookbook 指的是实用经典案例的意思,是对一些普遍性问题的解决方案的总结和整理。
|
||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "d2-admin",
|
"name": "d2-admin",
|
||||||
"version": "1.1.5",
|
"version": "1.1.6",
|
||||||
"private": true,
|
"private": true,
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"serve": "vue-cli-service serve --open",
|
"serve": "vue-cli-service serve --open",
|
||||||
|
|||||||
@@ -0,0 +1,61 @@
|
|||||||
|
<template>
|
||||||
|
<div
|
||||||
|
class="d2-contentmenu-list"
|
||||||
|
@click="rowClick">
|
||||||
|
<div
|
||||||
|
v-for="item in menulist"
|
||||||
|
:key="item.value"
|
||||||
|
:data-value="item.value"
|
||||||
|
class="d2-contentmenu-item"
|
||||||
|
flex="cross:center main:center">
|
||||||
|
<d2-icon
|
||||||
|
v-if="item.icon"
|
||||||
|
:name="item.icon"/>
|
||||||
|
<div
|
||||||
|
class="d2-contentmenu-item-title"
|
||||||
|
flex-box="1">
|
||||||
|
{{item.title}}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'd2-contextmenu-list',
|
||||||
|
props: {
|
||||||
|
menulist: {
|
||||||
|
type: Array,
|
||||||
|
default: () => []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
rowClick (event) {
|
||||||
|
let target = event.target
|
||||||
|
while(!target.dataset.value) {
|
||||||
|
target = target.parentNode
|
||||||
|
}
|
||||||
|
this.$emit('rowClick', target.dataset.value)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.d2-contentmenu-list {
|
||||||
|
.d2-contentmenu-item {
|
||||||
|
padding: 8px 20px 8px 15px;
|
||||||
|
margin: 0;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #606266;
|
||||||
|
cursor: pointer;
|
||||||
|
&:hover {
|
||||||
|
background: #ecf5ff;
|
||||||
|
color: #66b1ff;
|
||||||
|
}
|
||||||
|
.d2-contentmenu-item-title {
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
71
src/layout/header-aside/components/contextmenu/index.vue
Normal file
71
src/layout/header-aside/components/contextmenu/index.vue
Normal file
@@ -0,0 +1,71 @@
|
|||||||
|
<template>
|
||||||
|
<div
|
||||||
|
class="d2-contextmenu"
|
||||||
|
v-show="flag"
|
||||||
|
:style="style">
|
||||||
|
<slot/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'd2-contextmenu',
|
||||||
|
props: {
|
||||||
|
visible: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
x: {
|
||||||
|
type: Number,
|
||||||
|
default: 0
|
||||||
|
},
|
||||||
|
y: {
|
||||||
|
type: Number,
|
||||||
|
default: 0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
flag: {
|
||||||
|
get () {
|
||||||
|
if (this.visible) {
|
||||||
|
// 注册全局监听事件 [ 目前只考虑鼠标解除触发 ]
|
||||||
|
window.addEventListener('mousedown', this.watchContextmenu)
|
||||||
|
}
|
||||||
|
return this.visible
|
||||||
|
},
|
||||||
|
set (newVal) {
|
||||||
|
this.$emit('update:visible', newVal)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
style () {
|
||||||
|
return {
|
||||||
|
left: this.x + 'px',
|
||||||
|
top: this.y + 'px',
|
||||||
|
display: this.visible ? 'block' : 'none '
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
watchContextmenu (event) {
|
||||||
|
if (!this.$el.contains(event.target)) this.flag = false
|
||||||
|
window.removeEventListener('mousedown', this.watchContextmenu)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted () {
|
||||||
|
// 将菜单放置到body下
|
||||||
|
document.querySelector('body').appendChild(this.$el)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.d2-contextmenu {
|
||||||
|
position: absolute;
|
||||||
|
padding: 5px 0;
|
||||||
|
z-index: 2018;
|
||||||
|
background: #FFF;
|
||||||
|
border: 1px solid #cfd7e5;
|
||||||
|
border-radius: 4px;
|
||||||
|
box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -2,23 +2,34 @@
|
|||||||
<div class="d2-multiple-page-control-group" flex>
|
<div class="d2-multiple-page-control-group" flex>
|
||||||
<div class="d2-multiple-page-control-content" flex-box="1">
|
<div class="d2-multiple-page-control-content" flex-box="1">
|
||||||
<div class="d2-multiple-page-control-content-inner">
|
<div class="d2-multiple-page-control-content-inner">
|
||||||
|
<d2-contextmenu
|
||||||
|
:visible.sync="contextmenuFlag"
|
||||||
|
:x="contentmenuX"
|
||||||
|
:y="contentmenuY">
|
||||||
|
<d2-contextmenu-list
|
||||||
|
:menulist="tagName === 'index' ? contextmenuListIndex : contextmenuList"
|
||||||
|
@rowClick="contextmenuClick"/>
|
||||||
|
</d2-contextmenu>
|
||||||
<el-tabs
|
<el-tabs
|
||||||
class="d2-multiple-page-control"
|
class="d2-multiple-page-control"
|
||||||
:value="pageCurrent"
|
:value="pageCurrent"
|
||||||
type="card"
|
type="card"
|
||||||
:closable="true"
|
:closable="true"
|
||||||
@tab-click="handleClick"
|
@tab-click="handleClick"
|
||||||
@edit="handleTabsEdit">
|
@edit="handleTabsEdit"
|
||||||
|
@contextmenu.native="handleContextmenu">
|
||||||
<el-tab-pane
|
<el-tab-pane
|
||||||
|
class="hello"
|
||||||
v-for="(page, index) in pageOpenedList"
|
v-for="(page, index) in pageOpenedList"
|
||||||
:key="index"
|
:key="index"
|
||||||
:label="page.meta.title || '未命名'"
|
:label="page.meta.title || '未命名'"
|
||||||
:name="page.name">
|
:name="page.name"/>
|
||||||
</el-tab-pane>
|
|
||||||
</el-tabs>
|
</el-tabs>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="d2-multiple-page-control-btn" flex-box="0">
|
<div
|
||||||
|
class="d2-multiple-page-control-btn"
|
||||||
|
flex-box="0">
|
||||||
<el-dropdown
|
<el-dropdown
|
||||||
split-button
|
split-button
|
||||||
@click="handleControlBtnClick"
|
@click="handleControlBtnClick"
|
||||||
@@ -50,6 +61,27 @@
|
|||||||
<script>
|
<script>
|
||||||
import { mapState, mapMutations } from 'vuex'
|
import { mapState, mapMutations } from 'vuex'
|
||||||
export default {
|
export default {
|
||||||
|
components: {
|
||||||
|
D2Contextmenu: () => import('../contextmenu'),
|
||||||
|
D2ContextmenuList: () => import('../contextmenu/components/contentmenuList')
|
||||||
|
},
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
contextmenuFlag: false,
|
||||||
|
contentmenuX: 0,
|
||||||
|
contentmenuY: 0,
|
||||||
|
contextmenuListIndex: [
|
||||||
|
{ icon: 'times-circle', title: '关闭全部', value: 'all' }
|
||||||
|
],
|
||||||
|
contextmenuList: [
|
||||||
|
{ icon: 'arrow-left', title: '关闭左侧', value: 'left' },
|
||||||
|
{ icon: 'arrow-right', title: '关闭右侧', value: 'right' },
|
||||||
|
{ icon: 'times', title: '关闭其它', value: 'other' },
|
||||||
|
{ icon: 'times-circle', title: '关闭全部', value: 'all' }
|
||||||
|
],
|
||||||
|
tagName: 'index'
|
||||||
|
}
|
||||||
|
},
|
||||||
computed: {
|
computed: {
|
||||||
...mapState({
|
...mapState({
|
||||||
pageOpenedList: state => state.d2admin.pageOpenedList,
|
pageOpenedList: state => state.d2admin.pageOpenedList,
|
||||||
@@ -63,19 +95,46 @@ export default {
|
|||||||
'd2adminTagCloseOther',
|
'd2adminTagCloseOther',
|
||||||
'd2adminTagCloseAll'
|
'd2adminTagCloseAll'
|
||||||
]),
|
]),
|
||||||
|
/**
|
||||||
|
* @description 右键菜单功能点击
|
||||||
|
*/
|
||||||
|
handleContextmenu (event) {
|
||||||
|
let target = event.target
|
||||||
|
if (target.className.indexOf('el-tabs__item') > -1 || target.parentNode.className.indexOf('el-tabs__item') > -1) {
|
||||||
|
event.preventDefault()
|
||||||
|
event.stopPropagation()
|
||||||
|
this.contentmenuX = event.clientX
|
||||||
|
this.contentmenuY = event.clientY
|
||||||
|
this.tagName = target.getAttribute('aria-controls').slice(5)
|
||||||
|
this.contextmenuFlag = true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
/**
|
||||||
|
* @description 右键菜单的row-click事件
|
||||||
|
*/
|
||||||
|
contextmenuClick (command) {
|
||||||
|
this.handleControlItemClick(command, this.tagName)
|
||||||
|
},
|
||||||
/**
|
/**
|
||||||
* @description 接收点击关闭控制上选项的事件
|
* @description 接收点击关闭控制上选项的事件
|
||||||
*/
|
*/
|
||||||
handleControlItemClick (command) {
|
handleControlItemClick (command, tagName = null) {
|
||||||
|
if (tagName) {
|
||||||
|
this.contextmenuFlag = false
|
||||||
|
}
|
||||||
|
const params = {
|
||||||
|
pageSelect: tagName,
|
||||||
|
vm: this
|
||||||
|
}
|
||||||
switch (command) {
|
switch (command) {
|
||||||
case 'left':
|
case 'left':
|
||||||
this.d2adminTagCloseLeft()
|
this.d2adminTagCloseLeft(params)
|
||||||
break
|
break
|
||||||
case 'right':
|
case 'right':
|
||||||
this.d2adminTagCloseRight()
|
this.d2adminTagCloseRight(params)
|
||||||
break
|
break
|
||||||
case 'other':
|
case 'other':
|
||||||
this.d2adminTagCloseOther()
|
this.d2adminTagCloseOther(params)
|
||||||
break
|
break
|
||||||
case 'all':
|
case 'all':
|
||||||
this.d2adminTagCloseAll(this)
|
this.d2adminTagCloseAll(this)
|
||||||
|
|||||||
@@ -1 +1 @@
|
|||||||
2b2ad59e01ff445075c4b6d63e425cba12153aec
|
f6b747b5dbf484da5c8b5876c9d54212c90c3550
|
||||||
Reference in New Issue
Block a user