mirror of
https://gitee.com/hoslay/ddei-editor.git
synced 2025-12-06 17:18:36 +08:00
增加顶部菜单的扩展机制
This commit is contained in:
parent
43c4d18459
commit
aa802ad524
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "ddei-editor",
|
"name": "ddei-editor",
|
||||||
"version": "1.2.41-121",
|
"version": "1.2.41-122",
|
||||||
"private": false,
|
"private": false,
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"author": "hoslay <3697355039@qq.com>",
|
"author": "hoslay <3697355039@qq.com>",
|
||||||
|
|||||||
@ -4,18 +4,24 @@
|
|||||||
:class="{ 'item-drag': options?.drag == 1 && options?.direct != 2, 'item-drag-2': options?.drag == 1 && options?.direct == 2, 'item-block': options?.drag != 1 }"
|
:class="{ 'item-drag': options?.drag == 1 && options?.direct != 2, 'item-drag-2': options?.drag == 1 && options?.direct == 2, 'item-block': options?.drag != 1 }"
|
||||||
@mousedown="options?.drag == 1 && prepareDragBox()">
|
@mousedown="options?.drag == 1 && prepareDragBox()">
|
||||||
</div>
|
</div>
|
||||||
<div class="item" @click="newFile">
|
<div class="item" v-if="!options?.items" @click="newFile">
|
||||||
新建
|
新建
|
||||||
</div>
|
</div>
|
||||||
<div class="item" @click="openFile">
|
<div class="item" v-if="!options?.items" @click="openFile">
|
||||||
打开
|
打开
|
||||||
</div>
|
</div>
|
||||||
<div class="item" @click="save">
|
<div class="item" v-if="!options?.items" @click="save">
|
||||||
保存
|
保存
|
||||||
</div>
|
</div>
|
||||||
<div class="item" @click="download">
|
<div class="item" v-if="!options?.items" @click="download">
|
||||||
下载
|
下载
|
||||||
</div>
|
</div>
|
||||||
|
<div class="item" v-for="menu in options?.items">
|
||||||
|
<div v-if="menu && !menu.viewer && menu.id" @click="internalAction(menu.id,$event)">{{ menu.name }}</div>
|
||||||
|
<div v-if="menu && !menu.viewer && !menu.id" @click="menu.action(editor,$event)">{{ menu.name }}</div>
|
||||||
|
<component v-if="menu && menu.viewer" :is="menu.viewer" :options="options" :editor="editor"></component>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="item-block"></div>
|
<div class="item-block"></div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@ -79,6 +85,18 @@ export default {
|
|||||||
this.refreshData();
|
this.refreshData();
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
|
||||||
|
internalAction(id,evt){
|
||||||
|
if(id == 'ddei-core-save'){
|
||||||
|
this.save(evt)
|
||||||
|
} else if (id == 'ddei-core-open') {
|
||||||
|
this.openFile(evt)
|
||||||
|
} else if (id == 'ddei-core-new') {
|
||||||
|
this.newFile(evt)
|
||||||
|
} else if (id == 'ddei-core-download') {
|
||||||
|
this.download(evt)
|
||||||
|
}
|
||||||
|
},
|
||||||
/**
|
/**
|
||||||
* 保存
|
* 保存
|
||||||
* @param evt
|
* @param evt
|
||||||
|
|||||||
35
src/App.vue
35
src/App.vue
@ -1,6 +1,6 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import DDeiEditorView from "./editor/Editor.vue";
|
import DDeiEditorView from "./editor/Editor.vue";
|
||||||
import { DDeiCoreToolboxSimplePanel, DDeiCoreThemeBlack, DDeiCoreControls, DDeiCoreHotkeys, DDeiKeyActionAllSelect, DDeiCorePropertyViewPanel, DDeiCoreToolboxPanel, DDeiCoreSheetsPanel, DDeiCoreChangeRatioPanel, DDeiCoreChangeRatioDialog, DDeiCoreShapeCountPanel, DDeiCoreBottomMenuPanel, DDeiCoreStandLayout, DDeiCoreSimpleLayout,DDeiCoreOpenFilesViewPanel, DDeiCoreThemeDefault } from "@ddei/core";
|
import { DDeiCoreToolboxSimplePanel, DDeiCoreTopMenuSimplePanel, DDeiCoreThemeBlack, DDeiCoreControls, DDeiCoreHotkeys, DDeiKeyActionAllSelect, DDeiCorePropertyViewPanel, DDeiCoreToolboxPanel, DDeiCoreSheetsPanel, DDeiCoreChangeRatioPanel, DDeiCoreChangeRatioDialog, DDeiCoreShapeCountPanel, DDeiCoreBottomMenuPanel, DDeiCoreStandLayout, DDeiCoreSimpleLayout,DDeiCoreOpenFilesViewPanel, DDeiCoreThemeDefault } from "@ddei/core";
|
||||||
import { DDeiExtUML } from "@ddei/uml"
|
import { DDeiExtUML } from "@ddei/uml"
|
||||||
import { DDeiExtSearch } from "@ddei/search"
|
import { DDeiExtSearch } from "@ddei/search"
|
||||||
import { DDeiFuncCallResult, DDeiUtil, DDeiEditorUtil } from "ddei-framework";
|
import { DDeiFuncCallResult, DDeiUtil, DDeiEditorUtil } from "ddei-framework";
|
||||||
@ -12,6 +12,7 @@ import DDeiExtHtmlViewer from "@ddei/htmlviewer"
|
|||||||
import ReplaceDivDemo from "./ReplaceDivDemo.vue";
|
import ReplaceDivDemo from "./ReplaceDivDemo.vue";
|
||||||
import HtmlTooltipDemo from "./HtmlTooltipDemo.vue";
|
import HtmlTooltipDemo from "./HtmlTooltipDemo.vue";
|
||||||
import {controls as ControlDefinesDemo,groups as GroupDefinesDemo} from "./controldefinesdemo"
|
import {controls as ControlDefinesDemo,groups as GroupDefinesDemo} from "./controldefinesdemo"
|
||||||
|
import TopMenuViewerDemo from "./TopMenuViewerDemo.vue"
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
name: "APP",
|
name: "APP",
|
||||||
@ -111,7 +112,37 @@ export default defineComponent({
|
|||||||
DDeiExtUML,
|
DDeiExtUML,
|
||||||
DDeiExtQuickStyle,
|
DDeiExtQuickStyle,
|
||||||
DDeiExtSearch,
|
DDeiExtSearch,
|
||||||
DDeiExtQuickControl
|
DDeiExtQuickControl,
|
||||||
|
DDeiCoreTopMenuSimplePanel.configuration({
|
||||||
|
direct: 2,//方向,1纵向,2横向
|
||||||
|
position: 3,//位置1-9顺时针,1为左上角,9为中心
|
||||||
|
drag: 1,//是否允许拖拽位置
|
||||||
|
items:[//自定义菜单
|
||||||
|
{
|
||||||
|
id:"ddei-core-save",
|
||||||
|
name:"Save"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "ddei-core-open",
|
||||||
|
name: "打开"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
viewer: TopMenuViewerDemo
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "ddei-core-new",
|
||||||
|
name: "新建"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "测试",
|
||||||
|
action: function (editor) {
|
||||||
|
console.log("测试:" + editor.id)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}),
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// DDeiCoreStandLayout.configuration({
|
// DDeiCoreStandLayout.configuration({
|
||||||
//配置插件
|
//配置插件
|
||||||
|
|||||||
25
src/TopMenuViewerDemo.vue
Normal file
25
src/TopMenuViewerDemo.vue
Normal file
@ -0,0 +1,25 @@
|
|||||||
|
<script lang="ts">
|
||||||
|
export default {
|
||||||
|
name: "top-menu-custom-viewer-demo",
|
||||||
|
props: {
|
||||||
|
options: {
|
||||||
|
type: Object,
|
||||||
|
default: null
|
||||||
|
},
|
||||||
|
editor:{
|
||||||
|
type:Object,
|
||||||
|
default:null
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
click(){
|
||||||
|
console.log("自定义:"+this.editor)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<template>
|
||||||
|
<div style="color:red" @click="click">
|
||||||
|
自定义
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
Loading…
x
Reference in New Issue
Block a user