|
@ -14,11 +14,11 @@ |
|
|
<span :style="{width:item.width+'px'||'auto'}" :class="[item.width?'ellipsis':'']">{{ item.label }}</span> |
|
|
<span :style="{width:item.width+'px'||'auto'}" :class="[item.width?'ellipsis':'']">{{ item.label }}</span> |
|
|
</el-button> |
|
|
</el-button> |
|
|
</div> |
|
|
</div> |
|
|
<el-dropdown placement="top-start" v-if="showList().length>3"> |
|
|
<el-dropdown placement="top-start" v-if="showList().length>showMoreLength"> |
|
|
<el-button link class="more"> 更多 </el-button> |
|
|
<el-button link class="more" style="justify-self: flex-end;"> {{ t('ts.更多') }} </el-button> |
|
|
<template #dropdown> |
|
|
<template #dropdown> |
|
|
<el-dropdown-menu> |
|
|
<el-dropdown-menu> |
|
|
<el-dropdown-item v-for="(item, index) in getMoreList" :key="index+3" class="btn-div"> |
|
|
<el-dropdown-item v-for="(item, index) in getMoreList" :key="index+showMoreLength" class="btn-div"> |
|
|
<el-button |
|
|
<el-button |
|
|
v-show="!item.hide" |
|
|
v-show="!item.hide" |
|
|
:type="item.type" |
|
|
:type="item.type" |
|
@ -44,6 +44,7 @@ import { clearButtonBlurHandle } from '@/utils/index' |
|
|
import rowDrop from '@/components/rowDrop/index.vue' |
|
|
import rowDrop from '@/components/rowDrop/index.vue' |
|
|
import { CACHE_KEY, useCache } from '@/hooks/web/useCache' |
|
|
import { CACHE_KEY, useCache } from '@/hooks/web/useCache' |
|
|
const { wsCache } = useCache() |
|
|
const { wsCache } = useCache() |
|
|
|
|
|
const { t } = useI18n() // 国际化 |
|
|
|
|
|
|
|
|
const props = defineProps({ |
|
|
const props = defineProps({ |
|
|
Butttondata: { |
|
|
Butttondata: { |
|
@ -60,6 +61,10 @@ const props = defineProps({ |
|
|
type: Object, |
|
|
type: Object, |
|
|
default: null |
|
|
default: null |
|
|
}, |
|
|
}, |
|
|
|
|
|
showMoreLength: { |
|
|
|
|
|
type: Number, |
|
|
|
|
|
default: 3 |
|
|
|
|
|
} |
|
|
}) |
|
|
}) |
|
|
const showList = ()=>{ |
|
|
const showList = ()=>{ |
|
|
const all_permission = '*:*:*' |
|
|
const all_permission = '*:*:*' |
|
@ -80,13 +85,13 @@ const showList = ()=>{ |
|
|
} |
|
|
} |
|
|
const getMoreList = computed(()=>{ |
|
|
const getMoreList = computed(()=>{ |
|
|
let list = showList() |
|
|
let list = showList() |
|
|
return list.slice(3) |
|
|
return list.slice(props.showMoreLength) |
|
|
}) |
|
|
}) |
|
|
const getButtonList = computed(()=>{ |
|
|
const getButtonList = computed(()=>{ |
|
|
let list = showList() |
|
|
let list = showList() |
|
|
if(list.length>3){ |
|
|
if(list.length>3){ |
|
|
console.log('list===',list) |
|
|
console.log('list===',list) |
|
|
return list.slice(0, 3) |
|
|
return list.slice(0, props.showMoreLength) |
|
|
} |
|
|
} |
|
|
return list |
|
|
return list |
|
|
}) |
|
|
}) |
|
@ -131,5 +136,9 @@ const updataTableColumns = (val) => { |
|
|
margin: 0px; |
|
|
margin: 0px; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
.more{ |
|
|
|
|
|
&.el-button:focus-visible { |
|
|
|
|
|
outline: none; |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
</style> |
|
|
</style> |