按钮转换成文字类型

This commit is contained in:
仲么了
2024-01-30 14:11:29 +08:00
parent b921e2a7e5
commit a660ee86be
17 changed files with 94 additions and 107 deletions

View File

@@ -58,86 +58,68 @@
<!-- 按钮组 -->
<!-- 只对默认的编辑删除排序按钮进行鉴权其他按钮请通过 display 属性控制按钮是否显示 -->
<div v-if="field.render == 'buttons' && field.buttons">
<div v-if="field.render == 'buttons' && field.buttons" class="cn-render-buttons">
<template v-for="(btn, idx) in field.buttons" :key="idx">
<!-- 常规按钮 -->
<el-button
v-if="btn.render == 'basicButton'"
@click="onButtonClick(btn)"
:class="btn.class"
class="table-operate"
:type="btn.type"
:loading="props.row.loading || false"
:disabled="btn.disabled && btn.disabled(row, field)"
v-bind="btn.attr"
>
<Icon v-if="!props.row.loading" :name="btn.icon" />
<div v-if="btn.text" class="table-operate-text">{{ btn.text }}</div>
</el-button>
<!-- 带提示信息的按钮 -->
<el-tooltip
v-if="btn.render == 'tipButton'"
:disabled="btn.title && !btn.disabledTip ? false : true"
:content="btn.title"
placement="top"
>
<template v-if="!(btn.disabled && btn.disabled(row, field))">
<!-- 常规按钮 -->
<el-button
link
v-if="btn.render == 'basicButton'"
@click="onButtonClick(btn)"
:class="btn.class"
class="table-operate"
:type="btn.type"
:disabled="btn.disabled && btn.disabled(row, field)"
:loading="props.row.loading || false"
v-bind="btn.attr"
>
<Icon :name="btn.icon" />
<div v-if="btn.text" class="table-operate-text">{{ btn.text }}</div>
<div v-if="btn.text || btn.title" class="table-operate-text">{{ btn.text || btn.title }}</div>
</el-button>
</el-tooltip>
<!-- 确认框的按钮 -->
<el-popconfirm
v-if="btn.render == 'confirmButton'"
:disabled="btn.disabled && btn.disabled(row, field)"
v-bind="btn.popconfirm"
@confirm="onButtonClick(btn)"
>
<template #reference>
<div class="ml-6">
<el-tooltip :disabled="btn.title ? false : true" :content="btn.title" placement="top">
<el-button
:class="btn.class"
class="table-operate"
:type="btn.type"
:disabled="btn.disabled && btn.disabled(row, field)"
v-bind="btn.attr"
>
<Icon :name="btn.icon" />
<div v-if="btn.text" class="table-operate-text">{{ btn.text }}</div>
</el-button>
</el-tooltip>
</div>
</template>
</el-popconfirm>
<!-- 带提示的可拖拽按钮 -->
<el-tooltip
v-if="btn.render == 'moveButton' && btn.name == 'weigh-sort'"
:disabled="btn.title && !btn.disabledTip ? false : true"
:content="btn.title"
placement="top"
>
<el-button
:class="btn.class"
class="table-operate move-button"
:type="btn.type"
:disabled="btn.disabled && btn.disabled(row, field)"
v-bind="btn.attr"
<!-- 提示信息的按钮 -->
<el-tooltip
v-if="btn.render == 'tipButton'"
:disabled="btn.title && !btn.disabledTip ? false : true"
:content="btn.title"
placement="top"
>
<Icon :name="btn.icon" />
<div v-if="btn.text" class="table-operate-text">{{ btn.text }}</div>
</el-button>
</el-tooltip>
<el-button
link
@click="onButtonClick(btn)"
:class="btn.class"
class="table-operate"
:type="btn.type"
v-bind="btn.attr"
>
<div v-if="btn.text || btn.title" class="table-operate-text">{{ btn.text || btn.title }}</div>
</el-button>
</el-tooltip>
<!-- 带确认框的按钮 -->
<el-popconfirm
v-if="btn.render == 'confirmButton'"
:disabled="btn.disabled && btn.disabled(row, field)"
v-bind="btn.popconfirm"
@confirm="onButtonClick(btn)"
>
<template #reference>
<div style="display: inline-block">
<el-tooltip :disabled="btn.title ? false : true" :content="btn.title" placement="top">
<el-button
link
:class="btn.class"
class="table-operate"
:type="btn.type"
v-bind="btn.attr"
>
<div v-if="btn.text || btn.title" class="table-operate-text">
{{ btn.text || btn.title }}
</div>
</el-button>
</el-tooltip>
</div>
</template>
</el-popconfirm>
</template>
</template>
</div>
</template>
@@ -230,4 +212,9 @@ const getTagType = (value: string, custom: any): TagProps['type'] => {
height: 25px;
width: 100%;
}
.cn-render-buttons {
:deep(.el-button) {
margin-left: 0;
}
}
</style>

View File

@@ -34,7 +34,7 @@ const tableStore = new TableStore({
{ title: '状态', field: 'stateName' },
{
title: '操作',
width: '130',
width: '10',
render: 'buttons',
buttons: [
{
@@ -42,7 +42,7 @@ const tableStore = new TableStore({
title: '审核通过',
type: 'primary',
icon: 'el-icon-Check',
render: 'tipButton',
render: 'basicButton',
click: row => {
checkUser([row.id]).then(res => {
tableStore.index()

View File

@@ -49,7 +49,7 @@ const tableStore = new TableStore({
{
title: '操作',
align: 'center',
width: '130',
width: '180',
render: 'buttons',
buttons: [
{
@@ -57,7 +57,7 @@ const tableStore = new TableStore({
title: '编辑编辑',
type: 'primary',
icon: 'el-icon-EditPen',
render: 'tipButton',
render: 'basicButton',
click: row => {
popupRef.value.open('编辑接口权限', row)
}

View File

@@ -57,32 +57,32 @@ const tableStore = new TableStore({
{
title: '操作',
align: 'center',
width: '130',
width: '180',
render: 'buttons',
buttons: [
{
name: 'edit',
title: '新增菜单',
text: '新增',
type: 'primary',
icon: 'el-icon-Plus',
render: 'tipButton',
render: 'basicButton',
click: row => {
popupRef.value.open('新增菜单', { pid: row.id })
}
},
{
name: 'edit',
title: '编辑菜单',
text: '编辑',
type: 'primary',
icon: 'el-icon-EditPen',
render: 'tipButton',
render: 'basicButton',
click: row => {
popupRef.value.open('编辑菜单', row)
}
},
{
name: 'del',
title: '删除菜单',
text: '删除',
type: 'danger',
icon: 'el-icon-Delete',
render: 'confirmButton',

View File

@@ -70,7 +70,7 @@ const tableStore = new TableStore({
{
title: '操作',
align: 'center',
width: '130',
width: '180',
render: 'buttons',
buttons: [
{
@@ -78,7 +78,7 @@ const tableStore = new TableStore({
title: '编辑',
type: 'primary',
icon: 'el-icon-EditPen',
render: 'tipButton',
render: 'basicButton',
click: row => {
popupRef.value.open('编辑角色', row)
}

View File

@@ -101,7 +101,7 @@ const tableStore = new TableStore({
title: '编辑',
type: 'primary',
icon: 'el-icon-EditPen',
render: 'tipButton',
render: 'basicButton',
disabled: row => {
return row.state !== 1
},
@@ -114,7 +114,7 @@ const tableStore = new TableStore({
title: '修改密码',
type: 'primary',
icon: 'el-icon-Lock',
render: 'tipButton',
render: 'basicButton',
disabled: row => {
return row.state !== 1
},
@@ -135,7 +135,7 @@ const tableStore = new TableStore({
title: '激活',
type: 'success',
icon: 'el-icon-Open',
render: 'tipButton',
render: 'basicButton',
disabled: row => {
return row.state !== 2 && row.state !== 5 && row.state !== 0 && row.state !== 4
},
@@ -153,7 +153,7 @@ const tableStore = new TableStore({
title: '注销',
type: 'danger',
icon: 'el-icon-SwitchButton',
render: 'tipButton',
render: 'basicButton',
disabled: row => {
return row.state !== 1 && row.state !== 3
},

View File

@@ -146,7 +146,7 @@ const tableStore = new TableStore({
{
title: '操作',
align: 'center',
width: '130',
width: '180',
render: 'buttons',
buttons: [
{
@@ -154,7 +154,7 @@ const tableStore = new TableStore({
title: '波形分析',
type: 'primary',
icon: 'el-icon-DataLine',
render: 'tipButton',
render: 'basicButton',
disabled: row => {
return !row.wavePath && row.evtParamTm < 20
},

View File

@@ -110,7 +110,7 @@ const tableStore = new TableStore({
{
title: '操作',
align: 'center',
width: '130',
width: '180',
render: 'buttons',
buttons: [
{

View File

@@ -89,7 +89,7 @@ const tableStore = new TableStore({
{
title: '操作',
align: 'center',
width: '130',
width: '180',
render: 'buttons',
buttons: [
{
@@ -97,7 +97,7 @@ const tableStore = new TableStore({
title: '编辑',
type: 'primary',
icon: 'el-icon-EditPen',
render: 'tipButton',
render: 'basicButton',
click: row => {
popupDictionary.value.open('编辑字典', row)
}

View File

@@ -68,7 +68,7 @@ const tableStore = new TableStore({
{
title: '操作',
align: 'center',
width: '130',
width: '180',
render: 'buttons',
buttons: [
{

View File

@@ -66,7 +66,7 @@ const tableStore = new TableStore({
{
title: '操作',
align: 'center',
width: '130',
width: '180',
render: 'buttons',
buttons: [
{
@@ -74,7 +74,7 @@ const tableStore = new TableStore({
title: '编辑',
type: 'primary',
icon: 'el-icon-EditPen',
render: 'tipButton',
render: 'basicButton',
click: row => {
popupVersionRef.value.open('编辑版本', row)
}
@@ -84,7 +84,7 @@ const tableStore = new TableStore({
title: '启用',
type: 'success',
icon: 'el-icon-Open',
render: 'tipButton',
render: 'basicButton',
disabled: row => {
return row.status == 1
},

View File

@@ -265,7 +265,7 @@ const tableStore = new TableStore({
title: '编辑',
type: 'primary',
icon: 'el-icon-EditPen',
render: 'tipButton',
render: 'basicButton',
click: async row => {
dialogFormVisible.value = true
@@ -280,7 +280,7 @@ const tableStore = new TableStore({
title: '二维码',
type: 'primary',
icon: 'el-icon-Grid',
render: 'tipButton',
render: 'basicButton',
click: row => {
deivce.value = row
@@ -305,7 +305,7 @@ const tableStore = new TableStore({
title: '删除',
type: 'danger',
icon: 'el-icon-Delete',
render: 'tipButton',
render: 'basicButton',
click: row => {
ElMessageBox.confirm('确定删除该设备吗?', '提示', {

View File

@@ -44,7 +44,7 @@ const tableStore = new TableStore({
{
title: '操作',
align: 'center',
width: '130',
width: '180',
render: 'buttons',
buttons: [
{
@@ -52,7 +52,7 @@ const tableStore = new TableStore({
title: '编辑',
type: 'primary',
icon: 'el-icon-EditPen',
render: 'tipButton',
render: 'basicButton',
click: row => {
popupRef.value.open( row)
}

View File

@@ -37,7 +37,7 @@ const tableStore = new TableStore({
{
title: '操作',
align: 'center',
width: '130',
width: '180',
render: 'buttons',
buttons: [
{
@@ -45,7 +45,7 @@ const tableStore = new TableStore({
title: '绑定指标',
type: 'primary',
icon: 'el-icon-Connection',
render: 'tipButton',
render: 'basicButton',
click: row => {
bindingRef.value.open(row.id)
}
@@ -55,7 +55,7 @@ const tableStore = new TableStore({
title: '编辑',
type: 'primary',
icon: 'el-icon-EditPen',
render: 'tipButton',
render: 'basicButton',
click: row => {
addRef.value.open('编辑', row)
}

View File

@@ -69,7 +69,7 @@ const tableStore = new TableStore({
title: '编辑',
type: 'primary',
icon: 'el-icon-EditPen',
render: 'tipButton',
render: 'basicButton',
click: row => {
popupEditRef.value.open('编辑', {
...row,

View File

@@ -68,7 +68,7 @@ const tableStore = new TableStore({
title: '查看',
type: 'primary',
icon: 'el-icon-ZoomIn',
render: 'tipButton',
render: 'basicButton',
click: row => {
detail.value = row
}
@@ -77,7 +77,7 @@ const tableStore = new TableStore({
title: '编辑',
type: 'primary',
icon: 'el-icon-EditPen',
render: 'tipButton',
render: 'basicButton',
click: row => {
popupEditRef.value.open('编辑字典类型', row)
}

View File

@@ -57,7 +57,7 @@ const tableStore = new TableStore({
title: '新增',
type: 'primary',
icon: 'el-icon-Plus',
render: 'tipButton',
render: 'basicButton',
click: row => {
popupFormRef.value.open('新增字典类型', {
name: '',
@@ -74,7 +74,7 @@ const tableStore = new TableStore({
title: '编辑',
type: 'primary',
icon: 'el-icon-EditPen',
render: 'tipButton',
render: 'basicButton',
click: row => {
popupFormRef.value.open('编辑字典类型', row)
}