5 changed files with 231 additions and 68 deletions
@ -1,38 +1,84 @@ |
|||
<template> |
|||
<el-button |
|||
v-for="(item, index) in Butttondata" :key="index" |
|||
v-show="!item.hide" |
|||
:type="item.type" |
|||
:color="item.color" |
|||
:link = "item.link ? item.link : false" |
|||
v-hasPermi="[item.hasPermi] || []" |
|||
@click="buttonBaseClick(item.name,item,$event)" |
|||
> |
|||
<Icon v-if="item.icon" :icon="item.icon" class="mr-1px" /> |
|||
{{ item.label }} |
|||
</el-button> |
|||
<div v-for="(item, index) in Butttondata" :key="index"> |
|||
<el-button |
|||
v-show="!item.hide" |
|||
:type="item.type" |
|||
:color="item.color" |
|||
:link="item.link ? item.link : false" |
|||
v-hasPermi="[item.hasPermi] || []" |
|||
v-if="item.name != 'set'" |
|||
@click="buttonBaseClick(item.name, item, $event)" |
|||
> |
|||
<Icon v-if="item.icon" :icon="item.icon" class="mr-1px" /> |
|||
{{ item.label }} |
|||
</el-button> |
|||
<!-- 设置按钮 --> |
|||
<el-popover |
|||
:visible="popoverVisible" |
|||
placement="bottom" |
|||
:width="300" |
|||
trigger="click" |
|||
v-if="item.name == 'set'&&!item.hide" |
|||
> |
|||
<rowDrop |
|||
ref="rowDropRef" |
|||
@updata-table-columns="updataTableColumns" |
|||
:allSchemas="allSchemas" |
|||
@closeRowDrop="closeRowDrop" |
|||
@updataTableColumns="updataTableColumns" |
|||
/> |
|||
<template #reference> |
|||
<el-button |
|||
v-show="!item.hide" |
|||
:type="item.type" |
|||
:color="item.color" |
|||
:link="item.link ? item.link : false" |
|||
v-hasPermi="[item.hasPermi] || []" |
|||
@click="buttonBaseClick(item.name, item, $event)" |
|||
> |
|||
<Icon v-if="item.icon" :icon="item.icon" class="mr-1px" /> |
|||
{{ item.label }} |
|||
</el-button> |
|||
</template> |
|||
</el-popover> |
|||
</div> |
|||
<slot></slot> |
|||
</template> |
|||
<script setup> |
|||
import { Plus } from '@element-plus/icons-vue' |
|||
import { clearButtonBlurHandle } from '@/utils/index' |
|||
const props = defineProps({ |
|||
Butttondata: { |
|||
type: Array, |
|||
default: () => { |
|||
return [] |
|||
} |
|||
}, |
|||
}) |
|||
|
|||
// 传递给父类 |
|||
const emit = defineEmits([ |
|||
'buttonBaseClick', |
|||
]) |
|||
|
|||
const buttonBaseClick = (val, item, $event) => { |
|||
clearButtonBlurHandle($event)//解决el-button点击后颜色不恢复问题 |
|||
emit('buttonBaseClick', val, item, $event) |
|||
import { Plus } from '@element-plus/icons-vue' |
|||
import { clearButtonBlurHandle } from '@/utils/index' |
|||
import rowDrop from '@/components/rowDrop/index.vue' |
|||
const props = defineProps({ |
|||
Butttondata: { |
|||
type: Array, |
|||
default: () => { |
|||
return [] |
|||
} |
|||
}, |
|||
allSchemas: { |
|||
type: Object, |
|||
default: null |
|||
} |
|||
}) |
|||
|
|||
console.log('buttonsRight', props.Butttondata) |
|||
// 传递给父类 |
|||
const emit = defineEmits(['buttonBaseClick', 'updataTableColumns']) |
|||
|
|||
const buttonBaseClick = (val, item, $event) => { |
|||
clearButtonBlurHandle($event) //解决el-button点击后颜色不恢复问题 |
|||
emit('buttonBaseClick', val, item, $event) |
|||
} |
|||
const popoverVisible = ref(false) |
|||
// 关闭页面 |
|||
const closeRowDrop = () => { |
|||
popoverVisible.value = false |
|||
} |
|||
defineExpose({ |
|||
popoverVisible |
|||
}) |
|||
// 更新主列表字段 |
|||
const updataTableColumns = (val) => { |
|||
emit('updataTableColumns', val) |
|||
} |
|||
</script> |
|||
Loading…
Reference in new issue