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:
liyang
@@ -52,7 +52,7 @@ module.exports = {
|
||||
'/zh/guide/': sideBarGuide('指南'),
|
||||
'/zh/plugins/': sideBarPlugins('插件'),
|
||||
'/zh/components/': sideBarComponents('组件'),
|
||||
'/zh/article/': sideBarArticle('版本更新'),
|
||||
'/zh/article/': sideBarArticle('Cookbook', '版本更新'),
|
||||
'/zh/others/': sideBarOthers('其它')
|
||||
}
|
||||
}
|
||||
@@ -109,13 +109,20 @@ function sideBarComponents (title) {
|
||||
]
|
||||
}
|
||||
|
||||
function sideBarArticle (titleUpdate) {
|
||||
function sideBarArticle (titleCookBook, titleUpdate) {
|
||||
return [
|
||||
{
|
||||
title: titleCookBook,
|
||||
collapsable: false,
|
||||
children: [
|
||||
'cookbook/what-is-cookbook',
|
||||
'cookbook/combinable-questionnaire',
|
||||
]
|
||||
},
|
||||
{
|
||||
title: titleUpdate,
|
||||
collapsable: false,
|
||||
children: [
|
||||
'',
|
||||
'update/1.1.5',
|
||||
'update/1.1.4',
|
||||
'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",
|
||||
"version": "1.1.5",
|
||||
"version": "1.1.6",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"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-content" flex-box="1">
|
||||
<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
|
||||
class="d2-multiple-page-control"
|
||||
:value="pageCurrent"
|
||||
type="card"
|
||||
:closable="true"
|
||||
@tab-click="handleClick"
|
||||
@edit="handleTabsEdit">
|
||||
@edit="handleTabsEdit"
|
||||
@contextmenu.native="handleContextmenu">
|
||||
<el-tab-pane
|
||||
class="hello"
|
||||
v-for="(page, index) in pageOpenedList"
|
||||
:key="index"
|
||||
:label="page.meta.title || '未命名'"
|
||||
:name="page.name">
|
||||
</el-tab-pane>
|
||||
:name="page.name"/>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d2-multiple-page-control-btn" flex-box="0">
|
||||
<div
|
||||
class="d2-multiple-page-control-btn"
|
||||
flex-box="0">
|
||||
<el-dropdown
|
||||
split-button
|
||||
@click="handleControlBtnClick"
|
||||
@@ -50,6 +61,27 @@
|
||||
<script>
|
||||
import { mapState, mapMutations } from 'vuex'
|
||||
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: {
|
||||
...mapState({
|
||||
pageOpenedList: state => state.d2admin.pageOpenedList,
|
||||
@@ -63,19 +95,46 @@ export default {
|
||||
'd2adminTagCloseOther',
|
||||
'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 接收点击关闭控制上选项的事件
|
||||
*/
|
||||
handleControlItemClick (command) {
|
||||
handleControlItemClick (command, tagName = null) {
|
||||
if (tagName) {
|
||||
this.contextmenuFlag = false
|
||||
}
|
||||
const params = {
|
||||
pageSelect: tagName,
|
||||
vm: this
|
||||
}
|
||||
switch (command) {
|
||||
case 'left':
|
||||
this.d2adminTagCloseLeft()
|
||||
this.d2adminTagCloseLeft(params)
|
||||
break
|
||||
case 'right':
|
||||
this.d2adminTagCloseRight()
|
||||
this.d2adminTagCloseRight(params)
|
||||
break
|
||||
case 'other':
|
||||
this.d2adminTagCloseOther()
|
||||
this.d2adminTagCloseOther(params)
|
||||
break
|
||||
case 'all':
|
||||
this.d2adminTagCloseAll(this)
|
||||
|
||||
@@ -1 +1 @@
|
||||
2b2ad59e01ff445075c4b6d63e425cba12153aec
|
||||
f6b747b5dbf484da5c8b5876c9d54212c90c3550
|
||||
Reference in New Issue
Block a user