<template>
|
<a-menu :style="menuStyle" @click="menuItemClick" v-if="menuVisible" mode="vertical">
|
<template v-for="menuItem in baseContextMenuList">
|
<a-menu-item :key="menuItem.code" v-has="menuItem.code" v-if="menuItem.isHasPermission">
|
<a-icon :type="menuItem.icon"/>
|
{{ menuItem.label }}
|
</a-menu-item>
|
|
<a-menu-item :key="menuItem.code" v-else>
|
<a-icon :type="menuItem.icon"/>
|
{{ menuItem.label }}
|
</a-menu-item>
|
</template>
|
</a-menu>
|
</template>
|
|
<script>
|
export default {
|
name: 'DeviceStructureBaseContextMenu',
|
components: {},
|
props: {
|
tableRowInfo: {
|
type: Object
|
}
|
},
|
data() {
|
return {
|
menuVisible: false,
|
menuStyle: {
|
position: 'fixed',
|
top: 0,
|
left: 0,
|
border: '1px solid #eee',
|
boxShadow: '0 2px 8px rgba(0, 0, 0, 0.15)',
|
zIndex: 999
|
},
|
currentMenuLevel: '',
|
baseContextMenuList: [
|
{ label: '刷新', code: 'tree_reload', icon: 'reload', isHasPermission: false, isCommonMethod: false },
|
]
|
}
|
},
|
methods: {
|
menuItemClick({ key }) {
|
console.log('menuKey', key)
|
const isCommonMethod = this.baseContextMenuList.find(item => item.code === key).isCommonMethod
|
const modalTitle = this.baseContextMenuList.find(item => item.code === key).label
|
const menuKeyArray = key.split('_')
|
// product_add => handleAdd 触发对应组件事件
|
let methodName
|
// 判断是否为公共方法,如果为公共方法则截取专有属性product/component/part/process等字段
|
if (isCommonMethod) {
|
methodName = 'handle' + menuKeyArray.map(item => item[0].toUpperCase() + item.slice(1)).slice(1).join('')
|
} else {
|
methodName = 'handle' + menuKeyArray.map(item => item[0].toUpperCase() + item.slice(1)).join('')
|
}
|
this.$bus.$emit('treeMenuItemMethodTrigger', { methodName, modalTitle })
|
}
|
}
|
}
|
</script>
|
|
<style scoped>
|
/deep/ .ant-menu-item {
|
height: 32px;
|
line-height: 32px;
|
}
|
</style>
|