@epxing/designer 0.0.0-stage → 5.3.0-beta.1

package/src/visual/MEntitySubList.vue

@@ -0,0 +1,237 @@
+<script>
+import ComponentVue from './Component.vue'
+export default {
+  name: 'epx-visual-m-entity-sub-list',
+  extends: ComponentVue,
+  watch: {
+    allConfigs: {
+      handler (v) {
+        if (v.relationId) {
+          this.changeSubMeta(v.relationId)
+        }
+      },
+      immediate: true
+    },
+    pageRelationList (v) {
+      if (this.allConfigs.relationId) {
+        this.changeSubMeta(this.allConfigs.relationId)
+      }
+    }
+  },
+  methods: {
+    initDefaultConfigs () {
+      const { addPageFlag = 'add', editPageFlag = 'add', addPage = 'entity-add-page', openMode = '3' } = this.allConfigs
+      let metaKey = 'ID'
+      if (this.currentMeta) metaKey = this.currentMeta.getKey()
+      // 获取到该组件的默认配置
+      this.commonOperates = [
+        {
+          text: '新增',
+          handler: 'goPage',
+          action: 'save',
+          ui: 'primary',
+          pageFlag: addPageFlag,
+          num: 0,
+          params: {
+            component: '$[$configs.addPage]',
+            fieldConfigs: '$[addFormFieldConfigs]',
+            callback: '$[reloadData]',
+            isSub: true
+          }
+        }, {
+          text: '编辑',
+          handler: 'goPage',
+          action: 'update',
+          pageFlag: editPageFlag,
+          num: 1,
+          params: {
+            id: `#[${this.$metaKey}]`,
+            component: '$[$configs.addPage]',
+            pageType: 'EDIT',
+            fieldConfigs: '$[addFormFieldConfigs]',
+            callback: '$[reloadData]',
+            isSub: true
+          }
+        },
+        {
+          text: '删除',
+          handler: 'commonAction',
+          action: 'removeMulti',
+          num: 'n',
+          confirmMsg: this.$t('Confirm the deletion') + '？',
+          successMsg: '删除成功',
+          params: {
+            ids: `#[${metaKey}]`
+          }
+        },
+        {
+          text: '导入',
+          handler: 'goPage',
+          action: 'entityImport',
+          pageFlag: 'v_import',
+          params: {
+            component: 'import'
+          }
+        },
+        {
+          text: '导出',
+          handler: 'goPage',
+          action: 'entityExport',
+          pageFlag: 'v_export',
+          params: {
+            component: 'export',
+            selects: `#[${metaKey}]`,
+            total: '$[total]',
+            params: '$[params]'
+          }
+        },
+        {
+          text: '审核',
+          handler: 'goCheckPage',
+          params: {
+            id: `#[${metaKey}]`
+          }
+        }
+      ]
+      this.defaultConfigs = {
+        flex: false,
+        componentName: this.componentInfo.title,
+        addPageFlag: 'v_sub_add',
+        editPageFlag: 'v_sub_add',
+        detailPageFlag: 'v_sub_add',
+        componentType: '',
+        listFields: [this.currentMeta.getLabel()],
+        pageFlag: true,
+        pageSize: 20,
+        operateFlag: true,
+        operateEllipsis: 1,
+        multiSelectColumnFlag: true, // 是否显示多选框列
+        serialColumnFlag: true, // 是否显示序号列
+        operateColumnFlag: true, // 是否显示操作列
+        operateColumnEllipsis: 0,
+        operateColumnPosition: 'start',
+        span: 24,
+        operates: [
+          {
+            text: '新增',
+            handler: 'addEntity',
+            action: 'save',
+            ui: 'primary',
+            num: 0,
+            openMode,
+            component: addPage,
+            params: {}
+          }
+        ],
+        columnOperates: [
+          {
+            text: '编辑',
+            handler: 'goPage',
+            action: 'update',
+            pageFlag: editPageFlag,
+            num: 1,
+            params: {
+              id: `#[${this.$metaKey}]`,
+              component: '$[$configs.addPage]',
+              pageType: 'EDIT',
+              fieldConfigs: '$[addFormFieldConfigs]',
+              callback: '$[reloadData]',
+              isSub: true
+            }
+          },
+          {
+            text: '删除',
+            handler: 'commonAction',
+            action: 'removeMulti',
+            num: 'n',
+            confirmMsg: this.$t('Confirm the deletion') + '？',
+            successMsg: '删除成功',
+            params: {
+              ids: `#[${this.$metaKey}]`
+            }
+          }
+        ]
+      }
+    },
+    initConfigOptions () {
+      this.defaultConfigOptions = [
+        { key: 'componentName', label: '组件名称', type: 'input' },
+        // { key: 'note', label: '提示说明', type: 'textarea' },
+        {
+          key: 'relationId',
+          label: '关联标识符',
+          type: 'tree',
+          options: this.pageRelationList
+        }
+      ]
+      this.configOptions = this.defaultConfigOptions
+      if (this.componentMetaId) {
+        this.configOptions = [
+          ...this.defaultConfigOptions,
+          { key: 'componentType', label: '组件状态', type: 'radio', options: [{ label: '根据页面状态', value: '' }, { label: '详情', value: 'DETAIL' }, { label: '只读', value: 'READONLY' }] },
+          { key: 'iconField', label: '图标字段', type: 'field' },
+          { key: 'rows', label: '行', type: 'row' },
+          { key: 'orderFields', label: '排序字段', type: 'order-field' },
+          { key: 'scopeParams', label: '查询范围', type: 'scope' },
+          { key: 'detailPageId', label: '详情页面', type: 'object', object: 'FM_PAGE_CONFIG' },
+          { key: 'operateFlag', label: '是否需要按钮', type: 'radio', options: [{ label: '需要', value: true }, { label: '不需要', value: false }] },
+          { key: 'operates', label: '操作按钮', type: 'operates' },
+          { key: 'operateEllipsis', label: '按钮显示数量', type: 'num' },
+          { key: 'operateColumnFlag', label: '是否需要操作列', type: 'radio', options: [{ label: '需要', value: true }, { label: '不需要', value: false }] },
+          { key: 'columnOperates', label: '操作列', type: 'operates' },
+          { key: 'operateColumnEllipsis', label: '操作列显示数量', type: 'num' },
+          { key: 'operateColumnPosition', label: '操作列位置', type: 'radio', options: [{ label: '开始', value: 'start' }, { label: '结束', value: 'end' }] },
+          { key: 'span', label: '宽度', type: 'select', options: this.spanOptions },
+          { key: 'xsspan', label: '移动端宽度', type: 'select', options: this.spanOptions },
+          { key: 'flex', label: '占据页面剩余空间', type: 'radio', options: [{ label: '是', value: true }, { label: '否', value: false }] }
+        ]
+      }
+    },
+    // changeSubMeta (v) {
+    //   this.pageMeta.relatedEntitys.forEach(entity => {
+    //     if (entity.flag === v) {
+    //       this.componentMetaId = entity.entityA
+    //     }
+    //   })
+    // },
+    changeSubMeta (v) {
+      // 二级关联
+      this.pageRelationList.forEach(entity => {
+        if (entity.value === v) {
+          this.componentMetaId = entity.entityA
+        } else if (entity.children && entity.children.length > 0) {
+          entity.children.forEach(item => {
+            if (item.value === v) {
+              this.componentMetaId = item.entityA
+            }
+          })
+        }
+      })
+    },
+    getFieldOptions () {
+      this.fieldOptions = [
+        { key: 'attriName', label: '字段', readonly: true },
+        { key: 'configWay', label: '配置方式', type: 'radio', options: [{ label: '默认配置', value: 'default' }, { label: '自定义', value: 'custom' }], defaultValue: 'default' },
+        { key: 'attriLabel', label: '名称', type: 'text' },
+        { key: 'width', label: '宽度', type: 'text', defaultValue: '120' },
+        { key: 'isLabel', label: '外部标签', type: 'radio', options: [{ label: '是', value: true }, { label: '否', value: false }], defaultValue: false },
+        { key: 'showLabel', label: '显示标题', type: 'radio', options: [{ label: '显示', value: true }, { label: '不显示', value: false }], defaultValue: false },
+        { key: 'isWrap', label: '是否换行', type: 'radio', options: [{ label: '是', value: true }, { label: '否', value: false }], defaultValue: false },
+        { key: 'split', label: '分隔符', type: 'radio', options: [{ label: '竖号', value: ' | ' }, { label: '斜杠', value: ' / ' }, { label: '空格', value: ' ' }], defaultValue: ' | ' },
+        { key: 'function', label: '函数', type: 'function' },
+        { key: 'locked', label: '是否锁定', type: 'radio', options: [{ label: '是', value: true }, { label: '否', value: false }], defaultValue: false },
+        { key: 'color', label: '字体颜色', type: 'color', defaultValue: '#333' },
+        { key: 'fontWeight', label: '是否加粗', type: 'radio', options: [{ label: '是', value: 'bold' }, { label: '否', value: 'normal' }], defaultValue: 'normal' },
+        { key: 'fontSize', label: '字体大小', type: 'num', defaultValue: 14 }
+      ]
+    }
+  },
+  created () {
+
+  }
+}
+</script>
+
+<style>
+
+</style>

package/src/visual/MetaList.vue

@@ -0,0 +1,24 @@
+<script>
+import EntityList from './EntityList'
+export default {
+  extends: EntityList,
+  name: 'epx-visual-meta-list',
+  created () {
+    this.handlerList = [
+      { label: '打开页面', value: 'goPage' },
+      { label: '通用请求', value: 'commonAction' },
+      { label: '审核页面', value: 'goCheckPage' },
+      { label: '批量编辑', value: 'editMultiEntity' },
+      { label: '对象复制', value: 'META_COPY' },
+      { label: '获取字段配置', value: 'getMetaFields' },
+      { label: '获取实体类内容', value: 'getMetaEntityFields' },
+      { label: '生成测试数据', value: 'genTestData' }
+    ]
+    this.getOperateOptions()
+  }
+}
+</script>
+
+<style>
+
+</style>

package/src/visual/ModuleIndexPage.vue

@@ -0,0 +1,70 @@
+<script>
+import ComponentVue from './Component.vue'
+export default {
+  name: 'epx-visual-module-index-page',
+  extends: ComponentVue,
+  methods: {
+    initDefaultConfigs () {
+      this.defaultConfigs = {
+        menuComponent: 'menu',
+        openMenu: 'first'
+      }
+    },
+    initConfigOptions () {
+      const configOptions = [
+        { key: 'componentName', label: '组件名称', type: 'input' },
+        { key: 'menuComponent', label: '菜单', type: 'object', object: 'FM_PAGE', dataKey: 'CODE' },
+        { key: 'menuWidth', label: '菜单宽度', type: 'num', defaultValue: 240 },
+        { key: 'menuFontSize', label: '菜单字体大小', type: 'num', defaultValue: 14 },
+        { key: 'backButton', label: '返回按钮', type: 'switch' },
+        {
+          key: 'openMenu',
+          label: '展开菜单',
+          type: 'radio',
+          options: [
+            {
+
+              label: '不展开',
+              value: 'none'
+            },
+            {
+              label: '展开第一个',
+              value: 'first'
+            },
+            {
+              label: '全部展开',
+              value: 'all'
+            }
+          ]
+        },
+        {
+          key: 'modulePageType',
+          label: '模块首页显示',
+          type: 'radio',
+          options: [
+            {
+
+              label: '子集模块',
+              value: 'sub'
+            },
+            {
+              label: '首个菜单页面',
+              value: 'menu'
+            },
+            {
+              label: '指定页面',
+              value: 'page'
+            }
+          ]
+        },
+        { key: 'pageId', label: '页面', type: 'object', object: 'FM_PAGE_CONFIG', showFlag: { modulePageType: 'page' } }
+      ]
+      this.configOptions = configOptions
+    }
+  }
+}
+</script>
+
+<style>
+
+</style>

package/src/visual/ModuleList.vue

@@ -0,0 +1,46 @@
+<script>
+import ComponentVue from './Component.vue'
+// 默认值逻辑
+export default {
+  name: 'epx-visual-module-list',
+  extends: ComponentVue,
+  methods: {
+    initDefaultConfigs () {
+      // 获取到该组件的默认配置
+      this.defaultConfigs = {
+        flex: false,
+        componentName: this.componentInfo.title,
+        level: 'child',
+        span: 24,
+        xsspan: 24
+      }
+    },
+    initConfigOptions () {
+      const configOptions = [
+        { key: 'componentName', label: '组件名称', type: 'input' },
+        { key: 'level', label: '显示模块', type: 'radio', options: [{ label: '子集', value: 'child' }, { label: '同级', value: 'sibling' }] },
+        { key: 'column', label: '显示列数', type: 'num', defaultValue: 4 },
+        { key: 'mcolumn', label: '显示列数（移动端）', type: 'num', defaultValue: 3 },
+        { key: 'span', label: '宽度', type: 'select', options: this.spanOptions },
+        { key: 'xsspan', label: '移动端宽度', type: 'select', options: this.spanOptions },
+        { key: 'height', label: '高度', type: 'height' },
+        { key: 'flex', label: '占据页面剩余空间', type: 'radio', options: [{ label: '是', value: true }, { label: '否', value: false }] }
+      ]
+      this.configOptions = configOptions
+    },
+    initConfig () {
+      const config = { ...this.compConfig }
+      if (this.componentInfo.span) {
+        config.span = this.componentInfo.span
+      }
+      this.config = config
+      for (const key in this.config) {
+        const configOption = this.configOptions.find(item => item.key === key) || {}
+        if (configOption.type === 'field') {
+          this.selectFieldWay[key] = 'custom'
+        }
+      }
+    }
+  }
+}
+</script>

package/src/visual/NavAddForm.vue

@@ -0,0 +1,177 @@
+<script>
+import ComponentVue from './Component.vue'
+export default {
+  name: 'epx-visual-nav-add-form',
+  extends: ComponentVue,
+  data () {
+    return {
+      subConfigOptions: [
+      ]
+    }
+  },
+  methods: {
+    getOperateOptions () {
+      this.handlerList = [
+        { label: '打开指定页面', value: 'goPage' },
+        { label: '发起通用请求', value: 'commonAction' },
+        { label: '发起业务规则', value: 'commonRuleAction' },
+        { label: '表单提交', value: 'submitForm' },
+        { label: '发起流程', value: 'applyEntity' },
+        { label: '执行流程审批', value: 'checkEntity' },
+        { label: '单个审核', value: 'check' },
+        { label: '报表打印', value: 'print' },
+        { label: '返回', value: 'backPage' },
+        { label: '自定义JS', value: 'customJs' }
+      ]
+      this.operateConfigs = [
+        {
+          key: 'base',
+          title: '基本',
+          options: ['text', 'ui', 'type', 'width', 'icon', 'preview']
+        },
+        {
+          key: 'event',
+          title: '事件',
+          options: ['beforeTrigger', 'handler', 'metaId', 'action', 'rule', 'openMode', 'page', 'pageType', 'printWay', 'printCode', 'cptName', 'destActivityId', 'function', 'processNode', 'processOptional', 'openOpinion', 'checkOpinion', 'checkSign', 'opinionRequire', 'signRequire', 'reload', 'params', 'afterTrigger', 'afterTriggerPage', 'afterTriggerPageOpenMode', 'afterTriggerParams']
+        },
+        {
+          key: 'advance',
+          title: '高级',
+          options: ['limitFlag', 'limitCondition', 'limitTip', 'showCondition', 'confirm', 'confirmMsg', 'successMsg', 'failMsg', 'mask']
+        }
+      ]
+      this.operateOptions = {
+        width: {
+          key: 'width',
+          label: '宽度',
+          type: 'num'
+        },
+        processOptional: {
+          key: 'processOptional',
+          label: '允许自选',
+          type: 'radio',
+          options: [{ label: '是', value: true }, { label: '否', value: false }],
+          defaultValue: false,
+          showFlag: { handler: 'applyEntity' }
+        },
+        opinionRequire: {
+          key: 'opinionRequire',
+          label: '审核意见必填',
+          type: 'radio',
+          options: [{ label: '是', value: true }, { label: '否', value: false }],
+          defaultValue: false,
+          showFlag: { handler: ['checkEntity', 'check'] }
+        },
+        signRequire: {
+          key: 'signRequire',
+          label: '审核签名必填',
+          type: 'radio',
+          options: [{ label: '是', value: true }, { label: '否', value: false }],
+          defaultValue: false,
+          showFlag: { handler: ['checkEntity', 'check'] }
+        }
+      }
+    },
+    initDefaultConfigs () {
+      // 获取到该组件的默认配置
+      this.commonOperates = [
+        { // 操作按钮
+          text: '保存',
+          ui: 'primary',
+          handler: 'submitForm'
+        }, {
+          text: '编辑',
+          ui: 'primary',
+          handler: 'editEntity'
+        },
+        {
+          text: '发起流程',
+          ui: 'primary',
+          handler: 'applyEntity'
+        },
+        {
+          text: '流程审批',
+          ui: 'primary',
+          handler: 'checkEntity'
+        },
+        {
+          text: '打印',
+          ui: 'primary',
+          handler: 'print'
+        },
+        {
+          text: '返回',
+          cls: 'btn_hollow',
+          handler: 'backPage'
+        }
+      ]
+      this.defaultConfigs = {
+        column: '2',
+        split: 16,
+        span: 24,
+        editOne: false,
+        operateFlag: true,
+        operates: []
+      }
+      this.subDefaultConfigs = {
+        formTitleFlag: true,
+        formTitleStyle: 'default'
+      }
+    },
+    getFieldOptions () {
+      this.fieldOptions = [
+        { key: 'attriName', label: '字段', readonly: true },
+        { key: 'configWay', label: '配置方式', type: 'radio', options: [{ label: '默认配置', value: 'default' }, { label: '自定义', value: 'custom' }], defaultValue: 'default' },
+        { key: 'attriLabel', label: '名称', type: 'text' },
+        {
+          key: 'state',
+          label: '字段状态',
+          type: 'radio',
+          options: [{ label: '详情', value: 'DETAIL' }, { label: '隐藏', value: 'HIDDEN' }],
+          defaultValue: 'DETAIL'
+        },
+        { key: 'width', label: '宽度', type: 'text', defaultValue: '120' },
+        { key: 'isLabel', label: '外部标签', type: 'radio', options: [{ label: '是', value: true }, { label: '否', value: false }], defaultValue: false },
+        { key: 'showLabel', label: '显示标题', type: 'radio', options: [{ label: '显示', value: true }, { label: '不显示', value: false }], defaultValue: false },
+        { key: 'isWrap', label: '是否换行', type: 'radio', options: [{ label: '是', value: true }, { label: '否', value: false }], defaultValue: false },
+        { key: 'split', label: '分隔符', type: 'radio', options: [{ label: '竖号', value: ' | ' }, { label: '斜杠', value: ' / ' }, { label: '空格', value: ' ' }], defaultValue: ' | ' },
+        { key: 'function', label: '函数', type: 'function' },
+        { key: 'locked', label: '是否锁定', type: 'radio', options: [{ label: '是', value: true }, { label: '否', value: false }], defaultValue: false },
+        { key: 'color', label: '字体颜色', type: 'color', defaultValue: '#333' },
+        { key: 'fontWeight', label: '是否加粗', type: 'radio', options: [{ label: '是', value: 'bold' }, { label: '否', value: 'normal' }], defaultValue: 'normal' },
+        { key: 'fontSize', label: '字体大小', type: 'num', defaultValue: 14 }
+      ]
+    },
+    initConfigOptions () {
+      const configOptions = [
+        { key: 'componentName', label: '组件名称', type: 'input' },
+        { key: 'column', label: '列数', type: 'input' },
+        { key: 'split', label: '分割线宽度', type: 'num' },
+        { key: 'editOne', label: '单条编辑', type: 'radio', options: [{ label: '是', value: true }, { label: '否', value: false }] },
+        { key: 'operateFlag', label: '是否显示按钮', type: 'radio', options: [{ label: '是', value: true }, { label: '否', value: false }] },
+        { key: 'iconField', label: '图标字段', type: 'field' },
+        { key: 'iconEditFlag', label: '图标可编辑', type: 'switch' },
+        { key: 'rows', label: '字段', type: 'row' },
+        { key: 'operates', label: '操作按钮', type: 'operates' },
+        { key: 'operateEllipsis', label: '按钮显示数量', type: 'num' },
+        { key: 'span', label: '宽度', type: 'select', options: this.spanOptions },
+        { key: 'xsspan', label: '移动端宽度', type: 'select', options: this.spanOptions },
+        { key: 'height', label: '高度' },
+        { key: 'flex', label: '占据页面剩余空间', type: 'radio', options: [{ label: '是', value: true }, { label: '否', value: false }] }
+      ]
+      // if (this.pageGlobalConfigs.layout === 'flex') {
+      //   configOptions.splice(1, 0, { key: 'flex', label: '占据页面剩余空间', type: 'radio', options: [{ label: '是', value: true }, { label: '否', value: false }] })
+      // }
+      this.configOptions = configOptions
+      this.subConfigOptions = [
+        { key: 'formTitleFlag', label: '是否显示表单标题', type: 'radio', options: [{ label: '是', value: true }, { label: '否', value: false }], defaultValue: true },
+        { key: 'formTitleStyle', label: '标题样式', type: 'radio', options: [{ label: '默认', value: 'default' }, { label: '简单', value: 'simple' }], defaultValue: 'default' }
+      ]
+    }
+  }
+}
+</script>
+
+<style>
+
+</style>

package/src/visual/NavFormCatalogItem.vue

@@ -0,0 +1,47 @@
+<script>
+import ComponentVue from './Component.vue'
+export default {
+  name: 'epx-visual-nav-form-catalog-item',
+  extends: ComponentVue,
+  methods: {
+    initConfigOptions () {
+      this.configOptions = [
+        { key: 'componentName', label: '组件名称' },
+        { key: 'componentEvents', label: '组件事件', type: 'event' },
+        {
+          key: 'showCondition',
+          label: '显示条件',
+          type: 'scope',
+          extendFields: [{
+            code: 'user',
+            text: '用户信息',
+            type: 'meta',
+            children: [
+              { code: 'user.account', text: '用户账户', type: 'field', field: 'user.account', dataType: 'text' },
+              { code: 'user.roleCode', text: '用户角色编号', type: 'field', field: 'user.roleCode', dataType: 'text' }
+            ]
+          }]
+        },
+        { key: 'span', label: '宽度', type: 'select', options: this.spanOptions },
+        { key: 'xsspan', label: '移动端宽度', type: 'select', options: this.spanOptions },
+        { key: 'height', label: '高度', type: 'input' },
+        { key: 'flex', label: '占据页面剩余空间', type: 'radio', options: [{ label: '是', value: true }, { label: '否', value: false }] }
+      ]
+    },
+    afterConfigOptions () {
+      if (this.upComponentInstance) {
+        // T29/$children：upComponentInstance 是 epx-component 包装，其内渲染的组件带 ref="component"
+      // （同 AddFormItem.vue:465 的既有写法）。Vue3 已移除 $children。
+        const upComponent = this.upComponentInstance.$refs.component || {}
+        const { subConfigOptions = [], subDefaultConfigs = {} } = upComponent
+        this.subConfigOptions = subConfigOptions
+        this.subDefaultConfigs = subDefaultConfigs
+      }
+    }
+  }
+}
+</script>
+
+<style>
+
+</style>

package/src/visual/NumItem.vue

@@ -0,0 +1,69 @@
+<script>
+import ComponentVue from './Component.vue'
+// 默认值逻辑
+export default {
+  name: 'epx-visual-num-item',
+  extends: ComponentVue,
+  watch: {
+    allConfigs: {
+      handler (v) {
+        if (v.metaId) {
+          this.componentMetaId = v.metaId
+        }
+      },
+      immediate: true
+    }
+  },
+  methods: {
+    initDefaultConfigs () {
+      // 获取到该组件的默认配置
+      this.defaultConfigs = {
+        flex: false,
+        componentName: this.componentInfo.title,
+        background: '#fff',
+        border: false,
+        orientation: 'vertical',
+        openMode: '3',
+        span: 24,
+        xsspan: 24
+      }
+    },
+    initConfigOptions () {
+      const configOptions = [
+        { key: 'componentName', label: '组件名称', type: 'input' },
+        { key: 'metaId', label: '对象', type: 'object', object: 'FM_ENTITY' },
+        { key: 'icon', label: '图标', type: 'object', object: 'FM_FONT_ICON' },
+        { key: 'menuId', label: '打开菜单', type: 'object', object: 'FM_MODULE', flag: 'config_menu' },
+        { key: 'pageId', label: '打开页面', type: 'object', object: 'FM_PAGE_CONFIG' },
+        {
+          key: 'openMode',
+          label: '页面打开方式',
+          type: 'radio',
+          options: [{ label: '直接打开', value: '3' }, { label: '弹窗', value: '2' }],
+          defaultValue: '3'
+        },
+        { key: 'params', label: '参数传递', type: 'params' },
+        { key: 'scopeParams', label: '查询参数', type: 'scope' },
+        { key: 'span', label: '宽度', type: 'select', options: this.spanOptions },
+        { key: 'xsspan', label: '移动端宽度', type: 'select', options: this.spanOptions },
+        { key: 'height', label: '高度', type: 'height' },
+        { key: 'flex', label: '占据页面剩余空间', type: 'radio', options: [{ label: '是', value: true }, { label: '否', value: false }] }
+      ]
+      this.configOptions = configOptions
+    },
+    initConfig () {
+      const config = { ...this.compConfig }
+      if (this.componentInfo.span) {
+        config.span = this.componentInfo.span
+      }
+      this.config = config
+      for (const key in this.config) {
+        const configOption = this.configOptions.find(item => item.key === key) || {}
+        if (configOption.type === 'field') {
+          this.selectFieldWay[key] = 'custom'
+        }
+      }
+    }
+  }
+}
+</script>