<template>
|
<div>
|
<!--表格基础按钮-->
|
<div v-if="type === 'table'">
|
<!--top展示表格上方区域 menu展示表格操作栏区域 -->
|
<el-button v-for="item in basicButtonList.top"
|
v-if="LocationType === 'top'"
|
:key="item.oid" :icon="item.icon"
|
:type="item.paramVOS.buttonType || 'primary'" plain
|
size="small"
|
@click="buttonClick(item)">
|
{{ item.name }}
|
</el-button>
|
|
<el-button v-for="item in basicButtonList.menu"
|
v-if="LocationType === 'menu'"
|
:key="item.oid"
|
:icon="item.paramVOS.icon ? item.paramVOS.icon : (item.paramVOS.buttonMethods === 'edit' ? 'el-icon-edit' : (item.paramVOS.buttonMethods === 'delete' ? 'el-icon-delete' : ''))"
|
:type="item.paramVOS.buttonType || 'text'" plain
|
size="small"
|
@click="buttonClick(item,scope)">
|
{{ item.name }}
|
</el-button>
|
</div>
|
<div v-else-if="type === 'form'">
|
<el-button v-for="item in basicButtonList"
|
:key="item.oid"
|
:icon="item.icon"
|
:type="(item.paramVOS.buttonType !== 'text' ? item.paramVOS.buttonType : 'primary') || 'primary'"
|
plain
|
size="small"
|
@click="buttonClick(item)">
|
{{ item.name }}
|
</el-button>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import func from "@/util/func";
|
import {validatenull} from "@/util/validate";
|
|
export default {
|
name: "dynamic-button",
|
props: {
|
type: {
|
type: String
|
},
|
LocationType: {
|
type: String,
|
},
|
scope: {
|
type: Object,
|
},
|
butttonList: {
|
type: Array
|
}
|
},
|
data() {
|
return {
|
visible: false,
|
formName: '',
|
}
|
},
|
computed: {
|
basicButtonList() {
|
// const basicColumn = this.butttonList.filter(item => item.id !== 'launchworkflow'); // 首先过滤出来基础表单事件的按钮
|
const basicColumn = this.butttonList;
|
|
if (this.type === 'form') {
|
|
return basicColumn;
|
|
} else if (this.type === 'table') {
|
|
const top = basicColumn.filter(item => item.paramVOS.location === 'top' || func.isEmpty(item.paramVOS.location)); // 过滤出来表格上面区域展示的按钮
|
const menu = basicColumn.filter(item => item.paramVOS.location === 'menu'); // 过滤出来操作栏展示的按钮
|
|
return {
|
top: top,
|
menu: menu
|
};
|
}
|
}
|
},
|
methods: {
|
buttonClick(item) {
|
this.$emit('buttonClick', this.scope, item)
|
}
|
}
|
}
|
</script>
|
|
<style scoped>
|
|
</style>
|