修复卡片组件card操作图标不显示的问题。

This commit is contained in:
vdpAdmin 2022-03-11 11:45:28 +08:00
parent 68e2db055f
commit dc96cf65cc
4 changed files with 34 additions and 8 deletions

View File

@ -76,9 +76,13 @@ export const loadExtension = function (app) {
{label: 'info', value: 'info'},
{label: 'error', value: 'error'},
]
PERegister.registerCPEditor(app, 'alert-type', 'alert-type-editor',
// PERegister.registerCPEditor(app, 'alert-type', 'alert-type-editor',
// PEFactory.createSelectEditor('type', 'extension.setting.alertType',
// {optionItems: typeOptions}))
/* type属性映射已存在无须再注册故只需注册属性编辑器即可 */
app.component('alert-type-editor',
PEFactory.createSelectEditor('type', 'extension.setting.alertType',
{optionItems: typeOptions}))
{optionItems: typeOptions}))
PERegister.registerCPEditor(app, 'alert-description', 'alert-description-editor',
PEFactory.createInputTextEditor('description', 'extension.setting.description'))

View File

@ -6,8 +6,14 @@
<template #header>
<div class="clear-fix">
<span>{{widget.options.label}}</span>
<i v-if="widget.options.showFold" class="float-right"
:class="[!widget.options.folded ? 'el-icon-arrow-down' : 'el-icon-arrow-up']" @click="toggleCard"></i>
<i v-if="widget.options.showFold" class="float-right" @click="toggleCard">
<template v-if="!widget.options.folded">
<el-icon><ArrowDown /></el-icon>
</template>
<template v-else>
<el-icon><ArrowUp /></el-icon>
</template>
</i>
</div>
</template>
<template v-if="!!widget.widgetList && (widget.widgetList.length > 0)">
@ -43,6 +49,7 @@
import ContainerItemWrapper from '@/components/form-render/container-item/container-item-wrapper'
import containerItemMixin from "@/components/form-render/container-item/containerItemMixin"
import FieldComponents from '@/components/form-designer/form-widget/field-widget/index'
import { ArrowDown, ArrowUp } from '@element-plus/icons-vue'
export default {
name: "card-item",
@ -51,6 +58,8 @@
components: {
ContainerItemWrapper,
...FieldComponents,
ArrowDown,
ArrowUp
},
props: {
widget: Object,

View File

@ -7,9 +7,14 @@
<template #header>
<div class="clear-fix">
<span>{{widget.options.label}}</span>
<i v-if="widget.options.showFold" class="float-right"
:class="[!widget.options.folded ? 'el-icon-arrow-down' : 'el-icon-arrow-up']"
@click="toggleCard"></i>
<i v-if="widget.options.showFold" class="float-right" @click="toggleCard">
<template v-if="!widget.options.folded">
<el-icon><ArrowDown /></el-icon>
</template>
<template v-else>
<el-icon><ArrowUp /></el-icon>
</template>
</i>
</div>
</template>
<draggable :list="widget.widgetList" item-key="id" v-bind="{group:'dragGroup', ghostClass: 'ghost',animation: 200}"
@ -39,6 +44,7 @@
//import Draggable from 'vuedraggable'
import ContainerWrapper from "@/components/form-designer/form-widget/container-widget/container-wrapper"
import FieldComponents from '@/components/form-designer/form-widget/field-widget/index'
import { ArrowDown, ArrowUp } from '@element-plus/icons-vue'
export default {
name: "card-widget",
@ -48,6 +54,8 @@
//Draggable,
ContainerWrapper,
...FieldComponents,
ArrowDown,
ArrowUp
},
props: {
widget: Object,

View File

@ -1,4 +1,7 @@
import {Edit, Minus, Plus, InfoFilled, Search, CirclePlus, Delete} from '@element-plus/icons-vue'
import {
Edit, Minus, Plus, InfoFilled, Search, CirclePlus, Delete,
ArrowDown, ArrowUp
} from '@element-plus/icons-vue'
export function registerIcon(app) {
app.component('el-icon-edit', Edit)
@ -8,4 +11,6 @@ export function registerIcon(app) {
app.component('el-icon-search', Search)
app.component('el-icon-circle-plus-outline', CirclePlus)
app.component('el-icon-delete', Delete)
app.component('el-icon-arrow-down', ArrowDown)
app.component('el-icon-arrow-up', ArrowUp)
}