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

src/extension/extension-loader.js

@@ -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'))

src/extension/samples/card/card-item.vue

@@ -6,8 +6,14 @@
       <template #header>
         <div class="clear-fix">
           <span>{{widget.options.label}}</span>
-          <i v-if="widget.options.showFold" class="float-right"
+          <i v-if="widget.options.showFold" class="float-right"  @click="toggleCard">
-             :class="[!widget.options.folded ? 'el-icon-arrow-down' : 'el-icon-arrow-up']" @click="toggleCard"></i>
+            <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,

src/extension/samples/card/card-widget.vue

@@ -7,9 +7,14 @@
       <template #header>
         <div class="clear-fix">
           <span>{{widget.options.label}}</span>
-          <i v-if="widget.options.showFold" class="float-right"
+          <i v-if="widget.options.showFold" class="float-right" @click="toggleCard">
-             :class="[!widget.options.folded ? 'el-icon-arrow-down' : 'el-icon-arrow-up']"
+            <template v-if="!widget.options.folded">
-             @click="toggleCard"></i>
+              <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,

src/utils/el-icons.js

@@ -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)
 }