修改 电网一张图告警明细数据
This commit is contained in:
@@ -7,28 +7,19 @@
|
||||
<Icon class="ba-icon-dark" v-if="field.render == 'icon'" :name="fieldValue ? fieldValue : field.default ?? ''" />
|
||||
|
||||
<!-- switch -->
|
||||
<el-switch
|
||||
v-if="field.render == 'switch'"
|
||||
@change="onChangeField(field, $event)"
|
||||
:model-value="fieldValue.toString()"
|
||||
:loading="row.loading"
|
||||
:active-value="field.activeValue"
|
||||
:inactive-value="field.inactiveValue"
|
||||
/>
|
||||
<el-switch v-if="field.render == 'switch'" @change="onChangeField(field, $event)"
|
||||
:model-value="fieldValue.toString()" :loading="row.loading" :active-value="field.activeValue"
|
||||
:inactive-value="field.inactiveValue" />
|
||||
|
||||
<!-- image -->
|
||||
<div v-if="field.render == 'image' && fieldValue" class="ba-render-image">
|
||||
<el-image
|
||||
:hide-on-click-modal="true"
|
||||
:preview-teleported="true"
|
||||
:preview-src-list="[fullUrl(fieldValue)]"
|
||||
:src="fieldValue.length > 100 ? fieldValue : fullUrl(fieldValue)"
|
||||
></el-image>
|
||||
<el-image :hide-on-click-modal="true" :preview-teleported="true" :preview-src-list="[fullUrl(fieldValue)]"
|
||||
:src="fieldValue.length > 100 ? fieldValue : fullUrl(fieldValue)"></el-image>
|
||||
</div>
|
||||
|
||||
<!-- tag -->
|
||||
<div v-if="field.render == 'tag' && fieldValue !== ''">
|
||||
<el-tag :type="getTagType(fieldValue, field.custom) || 'primary'" size="small">
|
||||
<el-tag :type="getTagType(fieldValue, field.custom) || 'primary'" :effect="field.effect ||'light'" size="small">
|
||||
{{ field.replaceValue ? field.replaceValue[fieldValue] : fieldValue }}
|
||||
</el-tag>
|
||||
</div>
|
||||
@@ -44,55 +35,28 @@
|
||||
</div>
|
||||
|
||||
<!-- customTemplate 自定义模板 -->
|
||||
<div
|
||||
v-if="field.render == 'customTemplate'"
|
||||
v-html="field.customTemplate ? field.customTemplate(row, field, fieldValue, column, index) : ''"
|
||||
></div>
|
||||
<div v-if="field.render == 'customTemplate'"
|
||||
v-html="field.customTemplate ? field.customTemplate(row, field, fieldValue, column, index) : ''"></div>
|
||||
|
||||
<!-- 自定义组件/函数渲染 -->
|
||||
<component
|
||||
v-if="field.render == 'customRender'"
|
||||
:is="field.customRender"
|
||||
:renderRow="row"
|
||||
:renderField="field"
|
||||
:renderValue="fieldValue"
|
||||
:renderColumn="column"
|
||||
:renderIndex="index"
|
||||
/>
|
||||
<component v-if="field.render == 'customRender'" :is="field.customRender" :renderRow="row" :renderField="field"
|
||||
:renderValue="fieldValue" :renderColumn="column" :renderIndex="index" />
|
||||
|
||||
<!-- 按钮组 -->
|
||||
<div v-if="field.render == 'buttons' && buttons" class="cn-render-buttons">
|
||||
<template v-for="(btn, idx) in buttons" :key="idx">
|
||||
<!-- 常规按钮 -->
|
||||
<el-button
|
||||
link
|
||||
v-if="btn.render == 'basicButton'"
|
||||
@click="onButtonClick(btn)"
|
||||
:class="btn.class"
|
||||
class="table-operate"
|
||||
:type="btn.type"
|
||||
:disabled="btn.showDisabled && btn.showDisabled(row, field)"
|
||||
:loading="props.row.loading || false"
|
||||
v-bind="btn.attr"
|
||||
>
|
||||
<el-button link v-if="btn.render == 'basicButton'" @click="onButtonClick(btn)" :class="btn.class"
|
||||
class="table-operate" :type="btn.type" :disabled="btn.showDisabled && btn.showDisabled(row, field)"
|
||||
:loading="props.row.loading || false" v-bind="btn.attr">
|
||||
<div v-if="btn.text || btn.title" class="table-operate-text">{{ btn.text || btn.title }}</div>
|
||||
</el-button>
|
||||
|
||||
<!-- 带提示信息的按钮 -->
|
||||
<el-tooltip
|
||||
v-if="btn.render == 'tipButton'"
|
||||
:disabled="btn.title && !btn.disabledTip ? false : true"
|
||||
:content="btn.title"
|
||||
placement="top"
|
||||
>
|
||||
<el-button
|
||||
link
|
||||
@click="onButtonClick(btn)"
|
||||
:class="btn.class"
|
||||
class="table-operate"
|
||||
:type="btn.type"
|
||||
v-bind="btn.attr"
|
||||
>
|
||||
<el-tooltip v-if="btn.render == 'tipButton'" :disabled="btn.title && !btn.disabledTip ? false : true"
|
||||
:content="btn.title" placement="top">
|
||||
<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>
|
||||
@@ -100,12 +64,8 @@
|
||||
</el-tooltip>
|
||||
|
||||
<!-- 带确认框的按钮 -->
|
||||
<el-popconfirm
|
||||
v-if="btn.render == 'confirmButton'"
|
||||
:disabled="btn.disabled && btn.disabled(row, field)"
|
||||
v-bind="btn.popconfirm"
|
||||
@confirm="onButtonClick(btn)"
|
||||
>
|
||||
<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-button link :class="btn.class" class="table-operate" :type="btn.type" v-bind="btn.attr">
|
||||
@@ -123,15 +83,10 @@
|
||||
</el-button>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item
|
||||
v-for="item in btn.buttons"
|
||||
:key="item.text"
|
||||
:command="item"
|
||||
:disabled="item.showDisabled && item.showDisabled(row, field)"
|
||||
:style="{
|
||||
<el-dropdown-item v-for="item in btn.buttons" :key="item.text" :command="item"
|
||||
:disabled="item.showDisabled && item.showDisabled(row, field)" :style="{
|
||||
color: item.type === 'primary' ? 'var(--el-color-primary)' : 'var(--el-color-danger)'
|
||||
}"
|
||||
>
|
||||
}">
|
||||
{{ item.text }}
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
@@ -233,29 +188,36 @@ const handlerCommand = (item: OptButton) => {
|
||||
.m-10 {
|
||||
margin: 4px;
|
||||
}
|
||||
|
||||
.ba-render-image {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.images-item {
|
||||
width: 50px;
|
||||
margin: 0 5px;
|
||||
}
|
||||
|
||||
.el-image {
|
||||
height: 36px;
|
||||
// width: 36px;
|
||||
}
|
||||
|
||||
.table-operate-text {
|
||||
padding-left: 5px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.table-operate {
|
||||
padding: 4px 5px;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.cn-render-buttons {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.icon {
|
||||
font-size: 12px !important;
|
||||
// color: var(--ba-bg-color-overlay) !important;
|
||||
@@ -265,18 +227,22 @@ const handlerCommand = (item: OptButton) => {
|
||||
.move-button {
|
||||
cursor: move;
|
||||
}
|
||||
|
||||
.ml-6 {
|
||||
display: inline-flex;
|
||||
vertical-align: middle;
|
||||
margin-left: 6px;
|
||||
}
|
||||
.ml-6 + .el-button {
|
||||
|
||||
.ml-6+.el-button {
|
||||
margin-left: 6px;
|
||||
}
|
||||
|
||||
.ba-render-color {
|
||||
height: 25px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.cn-render-buttons {
|
||||
:deep(.el-button) {
|
||||
margin-left: 0;
|
||||
|
||||
Reference in New Issue
Block a user