Skip to content

M
mes-ui
Commit e375268a authored by 周远喜's avatar 周远喜
Browse files
Options

Merge branch 'master' of http://git.mes123.com/zhouyx/mes-ui

parents 156e4b72 cd900c8b
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1713 additions and 1295 deletions
components/page/bmenu/components/Submenu.vue
View file @ e375268a
<template>
<transition name="contextmenu-submenu-fade">
<transition name="contextmenu-submenu-fade" v-if="show">
<div ref="menu" :class="[commonClass.menu, 'menu', customClass]" :style="{left: style.left + 'px', top: style.top + 'px', minWidth: style.minWidth + 'px', zIndex: style.zIndex}" v-if="visible" @contextmenu="(e)=>e.preventDefault()">
<div class="menu_body">
<template v-for="(item,index) of items">
......@@ -95,40 +95,50 @@ export default {
data: {
type: Array,
default: []
},
params: {
type: Object,
default: null
}
},
mounted() {
this.visible = true;
this.items = this.data
alert(JSON.stringify(this.items))
for (let item of this.items) {
if (item.icon) {
this.hasIcon = true;
break;
}
if (this.data != []) {
this.load(this.data)
}
this.$nextTick(() => {
const windowWidth = document.documentElement.clientWidth;
const windowHeight = document.documentElement.clientHeight;
const menu = this.$refs.menu;
const menuWidth = menu.offsetWidth;
const menuHeight = menu.offsetHeight;
},
methods: {
load(v) {
this.visible = true;
this.items = this.data
for (let item of this.items) {
if (item.icon) {
this.hasIcon = true;
break;
}
}
this.position.x = this.params.x
this.position.y = this.params.y
this.$nextTick(() => {
const windowWidth = document.documentElement.clientWidth;
const windowHeight = document.documentElement.clientHeight;
const menu = this.$refs.menu;
const menuWidth = menu.offsetWidth;
const menuHeight = menu.offsetHeight;
(this.openTrend === SUBMENU_OPEN_TREND_LEFT ?
this.leftOpen :
this.rightOpen)(windowWidth, windowHeight, menuWidth);
(this.openTrend === SUBMENU_OPEN_TREND_LEFT ?
this.leftOpen :
this.rightOpen)(windowWidth, windowHeight, menuWidth);
this.style.top = this.position.y;
if (this.position.y + menuHeight > windowHeight) {
if (this.position.height === 0) {
this.style.top = this.position.y - menuHeight;
} else {
this.style.top = windowHeight - menuHeight;
this.style.top = this.position.y;
if (this.position.y + menuHeight > windowHeight) {
if (this.position.height === 0) {
this.style.top = this.position.y - menuHeight;
} else {
this.style.top = windowHeight - menuHeight;
}
}
}
});
},
methods: {
});
},
leftOpen(windowWidth, windowHeight, menuWidth) {
this.style.left = this.position.x - menuWidth;
this.openTrend = SUBMENU_OPEN_TREND_LEFT;
......@@ -219,6 +229,7 @@ export default {
data(v) {
if (v != []) {
this.data = v;
this.load(this.data)
}
},
},
......
components/page/bmenu/index.vue
View file @ e375268a
<template>
<div class="ib">
<template>
右键菜单
</template>
</div>
<div></div>
</template>
<script>
......
components/page/dataGrid.vue
View file @ e375268a
......@@ -653,7 +653,7 @@ export default {
// );
// });
tempCol.forEach((elem) => {
if (e[elem.key] && e[elem.key] != "" && e[elem.key] != null) {
if ((e[elem.key] && e[elem.key] != "" && e[elem.key] != null) || e[elem.key] == 0) {
//如果数据字典项对应的DirName字段存在，通过name查询到对应的code，然后赋值。
let codeArr = [];
let keyValue = e[elem.key];
......
components/page/treeGrid/EditGrid.vue
View file @ e375268a
This diff is collapsed.
pages/project/plan/index.vue
View file @ e375268a
This diff is collapsed.
pages/test.vue
View file @ e375268a
......@@ -28,6 +28,7 @@
<MenuItem name="a4" to="/test/resource">资源选择</MenuItem>
<MenuItem name="a3" to="/test/view">详情拖拽排版</MenuItem>
<MenuItem name="a5" to="/test/test1">colum验证</MenuItem>
<MenuItem name="a6" to="/test/test2">右键点击/点击</MenuItem>
</div>
</Menu>
</div>
......
pages/test/test2.vue
View file @ e375268a
<template>
<div style="width:100%;">
<h2>SubMenu</h2>
<p><Button @click="showBmenu">showMenu</Button></p>
<Submenus :show="showStatu" :data="tempItems"></Submenus>
<div class="mt50 pl10">
<h2>SubMenu</h2>
<p><Button @click="showBmenu" ref="showBtn">左键打开菜单</Button></p>
<Submenus :show="showStatu" :data="tempItems" :params="params"></Submenus>
</div>
<div class="mt50 pl10">
<h2>Bmenu</h2>
<div @contextmenu="onCon" class="tc" style="width:120px;height:40px;line-height:40px;background:#f5f5f5;border:#ccc solid 1px; border-radius: 5px;">{{message}}</div>
</div>
</div>
</template>
......@@ -13,70 +19,66 @@ export default {
data() {
return {
//submenu
showStatu: false,
tempItems: [{
label: "前进(F)",
disabled: true
},
{
label: "重新加载(R)",
divided: true,
icon: "el-icon-refresh"
},
{
label: "另存为(A)..."
},
{
label: "打印(P)...",
icon: "el-icon-printer"
},
{
label: "投射(C)...",
divided: true
},
{
label: "使用网页翻译(T)",
divided: true,
minWidth: 0,
children: [{
label: "翻译成简体中文"
},
{
label: "翻译成繁体中文"
},
],
},
],
showStatu: false, //控件是否显示
tempItems: [], //控件数据
params: {}, //控件坐标位置
message: "右键打开菜单",
useCustomClass: false,
nametitle: 'contextmenu-submenu',
level: '',
};
},
mounted() {
},
methods: {
showBmenu() {
showBmenu(event) {
let obj = event.target
let objSet = obj.getBoundingClientRect()
this.showStatu = true;
this.params = {
x: objSet.x,
y: objSet.bottom
};
console.log(event)
this.tempItems = [{
label: "返回(B)",
onClick: () => {
this.showStatu = false;
},
}, {
label: "前进(F)",
disabled: true
disabled: true,
onClick: () => {
this.showStatu = false;
},
},
{
label: "重新加载(R)",
divided: true,
icon: "el-icon-refresh"
icon: "el-icon-refresh",
onClick: () => {
this.showStatu = false;
},
},
{
label: "另存为(A)..."
label: "另存为(A)...",
onClick: () => {
this.showStatu = false;
},
},
{
label: "打印(P)...",
icon: "el-icon-printer"
icon: "el-icon-printer",
onClick: () => {
this.showStatu = false;
},
},
{
label: "投射(C)...",
divided: true
divided: true,
onClick: () => {
this.showStatu = false;
},
},
{
label: "使用网页翻译(T)",
......@@ -90,8 +92,144 @@ export default {
},
],
},
]
}
];
event.preventDefault();
},
onCon(event) {
this.$contextmenu({
items: [{
label: `自定义样式(${this.useCustomClass ? "开" : "关"})`,
onClick: () => {
this.useCustomClass = !this.useCustomClass;
},
},
{
label: "返回(B)",
onClick: () => {
this.message = "返回(B)";
console.log("返回(B)");
},
},
{
label: "前进(F)",
disabled: true
},
{
label: "重新加载(R)",
divided: true,
icon: "el-icon-refresh"
},
{
label: "另存为(A)..."
},
{
label: "打印(P)...",
icon: "el-icon-printer"
},
{
label: "投射(C)...",
divided: true
},
{
label: "使用网页翻译(T)",
divided: true,
minWidth: 0,
children: [{
label: "翻译成简体中文"
},
{
label: "翻译成繁体中文"
},
],
},
{
label: "截取网页(R)",
minWidth: 0,
children: [{
label: "返回(B)",
onClick: () => {
this.message = "返回(B)";
console.log("返回(B)");
},
},
{
label: "前进(F)",
disabled: true
},
{
label: "重新加载(R)",
divided: true,
icon: "el-icon-refresh"
},
{
label: "另存为(A)..."
},
{
label: "打印(P)...",
icon: "el-icon-printer"
},
{
label: "投射(C)...",
divided: true
},
{
label: "使用网页翻译(T)",
divided: true,
minWidth: 0,
children: [{
label: "翻译成简体中文"
},
{
label: "翻译成繁体中文"
},
],
},
{
label: "截取网页(R)",
minWidth: 0,
children: [{
label: "截取可视化区域",
onClick: () => {
this.message = "截取可视化区域";
console.log("截取可视化区域");
},
},
{
label: "截取全屏"
},
],
},
{
label: "查看网页源代码(V)",
icon: "el-icon-view"
},
{
label: "检查(N)"
},
],
},
{
label: "查看网页源代码(V)",
icon: "el-icon-view"
},
{
label: "检查(N)"
},
],
event,
customClass: this.useCustomClass ? "custom-class" : "",
zIndex: 3,
minWidth: 230,
});
event.preventDefault();
},
},
};
</script>
<style>
.custom-class .menu_item__available:hover {
background: #ffecf2 !important;
color: #ff4050 !important;
}
</style>
pages/welcome/index.vue
View file @ e375268a
<template>
<div class="router-main flex fc-m fa-m">
<div class="router-main flex fc-m fa-m pr">
<ul class="pa navMenu">
<li
class="navMenuLi flex fc-m fa-m pr"
v-for="(item, index) in menus"
:key="index"
@mouseenter="navClick(item,index)"
>
<Icon type="ios-stats" class="f16" />{{ item.name }}
</li>
</ul>
<div class="bdImg pr" @click="pageClick">
<div
class="one pa cursor"
......@@ -27,9 +38,153 @@
<script>
import { isInteger } from "lodash";
import viewerVue from "../test/viewer.vue";
export default {
data() {
return {
navMenus: false,
onetest: "0",
menus: [
{
name: "项目管理",
style:{
left:'260px',
top:"100px"
},
children: [
{
name: "项目管理",
type: 2,
code: "",
icon: "",
target: 0,
url: "/project/project",
status: 1,
description: "",
source: 0,
app: "mes_roter",
priority: 0,
id: 541,
title: "项目管理",
expand: true,
upId: 537,
lay: 2,
children: null,
data: null,
},
{
name: "任务中心",
type: 2,
code: "",
icon: "",
target: 0,
url: "/project/task",
status: 1,
description: "",
source: 0,
app: "mes_roter",
priority: 0,
id: 542,
title: "任务中心",
expand: true,
upId: 537,
lay: 2,
children: null,
data: null,
},
{
name: "项目资源",
type: 2,
code: "",
icon: "",
target: 0,
url: "/project/resources",
status: 1,
description: "",
source: 0,
app: "mes_roter",
priority: 0,
id: 543,
title: "项目资源",
expand: true,
upId: 537,
lay: 2,
children: null,
data: null,
},
],
},
{
name: "文档管理",
style:{
left:'260px',
top:"190px"
},
children: [
{
name: "文档分类",
type: 2,
code: "",
icon: "",
target: 0,
url: "/word/classification",
status: 1,
description: "",
source: 0,
app: "mes_roter",
priority: 0,
id: 544,
title: "文档分类",
expand: true,
upId: 539,
lay: 2,
children: null,
data: null,
},
{
name: "文档管理",
type: 2,
code: "",
icon: "",
target: 0,
url: "/word/document",
status: 1,
description: "",
source: 0,
app: "mes_roter",
priority: 0,
id: 545,
title: "文档管理",
expand: true,
upId: 539,
lay: 2,
children: null,
data: null,
},
{
name: "模板类型",
type: 2,
code: "",
icon: "",
target: 0,
url: "/word/template",
status: 1,
description: "",
source: 0,
app: "mes_roter",
priority: 0,
id: 546,
title: "模板类型",
expand: true,
upId: 539,
lay: 2,
children: null,
data: null,
},
],
},
{ name: "大屏展示" },
],
list: [],
arrList: [],
isIndex: -1,
......@@ -81,6 +236,17 @@ export default {
var { left, top } = item.style;
this.menuPos = { left, top };
}
},
navClick(v,index) {
if (v.children && v.children.length > 0) {
var { left, top } = v.style;
this.list = v.children;
this.menuPos = { left, top };
this.menu = true;
}else{
this.menu = false;
}
},
leavePosition() {
this.oneShow = false;
......@@ -93,6 +259,39 @@ export default {
<style lang="less" scoped>
.router-main {
height: 100%;
.navMenu {
z-index: 999;
top: 90px;
left: 95px;
.navMenuLi {
cursor: pointer;
width: 185px;
height: 99px;
color: #ffffff;
.ivu-icon {
margin-right: 18px;
}
}
.navMenuLi:nth-child(1) {
background: url("../../assets/images/home/router/one.png") no-repeat;
background-size: contain;
}
.navMenuLi:nth-child(2) {
background: url("../../assets/images/home/router/two.png") no-repeat;
background-size: contain;
}
.navMenuLi:nth-child(3) {
background: url("../../assets/images/home/router/three.png") no-repeat;
background-size: contain;
}
.navMenuLi:hover {
transform: scale(1.1);
}
.navChild {
cursor: pointer;
left: 167px;
}
}
.oneHover {
border: 2px dotted #0868da;
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment