| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630 |
- // 表单属性【右面板】
- export const formConf = {
- formRef: 'elForm',
- formModel: 'formData',
- size: 'medium',
- labelPosition: 'right',
- labelWidth: 100,
- formRules: 'rules',
- gutter: 15,
- disabled: false,
- span: 24,
- formBtns: true
- }
- // 输入型组件 【左面板】
- export const inputComponents = [
- {
- // 组件的自定义配置
- __config__: {
- label: '单行文本',
- labelWidth: null,
- showLabel: true,
- changeTag: true,
- tag: 'el-input',
- tagIcon: 'input',
- defaultValue: undefined,
- required: true,
- layout: 'colFormItem',
- span: 24,
- document: 'https://element.eleme.cn/#/zh-CN/component/input',
- // 正则校验规则
- regList: []
- },
- // 组件的插槽属性
- __slot__: {
- prepend: '',
- append: ''
- },
- // 其余的为可直接写在组件标签上的属性
- placeholder: '请输入',
- style: { width: '100%' },
- clearable: true,
- 'prefix-icon': '',
- 'suffix-icon': '',
- maxlength: null,
- 'show-word-limit': false,
- readonly: false,
- disabled: false
- },
- {
- __config__: {
- label: '多行文本',
- labelWidth: null,
- showLabel: true,
- tag: 'el-input',
- tagIcon: 'textarea',
- defaultValue: undefined,
- required: true,
- layout: 'colFormItem',
- span: 24,
- regList: [],
- changeTag: true,
- document: 'https://element.eleme.cn/#/zh-CN/component/input'
- },
- type: 'textarea',
- placeholder: '请输入',
- autosize: {
- minRows: 4,
- maxRows: 4
- },
- style: { width: '100%' },
- maxlength: null,
- 'show-word-limit': false,
- readonly: false,
- disabled: false
- },
- {
- __config__: {
- label: '密码',
- showLabel: true,
- labelWidth: null,
- changeTag: true,
- tag: 'el-input',
- tagIcon: 'password',
- defaultValue: undefined,
- layout: 'colFormItem',
- span: 24,
- required: true,
- regList: [],
- document: 'https://element.eleme.cn/#/zh-CN/component/input'
- },
- __slot__: {
- prepend: '',
- append: ''
- },
- placeholder: '请输入',
- 'show-password': true,
- style: { width: '100%' },
- clearable: true,
- 'prefix-icon': '',
- 'suffix-icon': '',
- maxlength: null,
- 'show-word-limit': false,
- readonly: false,
- disabled: false
- },
- {
- __config__: {
- label: '计数器',
- showLabel: true,
- changeTag: true,
- labelWidth: null,
- tag: 'el-input-number',
- tagIcon: 'number',
- defaultValue: undefined,
- span: 24,
- layout: 'colFormItem',
- required: true,
- regList: [],
- document: 'https://element.eleme.cn/#/zh-CN/component/input-number'
- },
- placeholder: '',
- min: undefined,
- max: undefined,
- step: 1,
- 'step-strictly': false,
- precision: undefined,
- 'controls-position': '',
- disabled: false
- },
- {
- __config__: {
- label: '编辑器',
- showLabel: true,
- changeTag: true,
- labelWidth: null,
- tag: 'tinymce',
- tagIcon: 'rich-text',
- defaultValue: null,
- span: 24,
- layout: 'colFormItem',
- required: true,
- regList: [],
- document: 'http://tinymce.ax-z.cn'
- },
- placeholder: '请输入',
- height: 300, // 编辑器高度
- branding: false // 隐藏右下角品牌烙印
- }
- ]
- // 选择型组件 【左面板】
- export const selectComponents = [
- {
- __config__: {
- label: '下拉选择',
- showLabel: true,
- labelWidth: null,
- tag: 'el-select',
- tagIcon: 'select',
- layout: 'colFormItem',
- span: 24,
- required: true,
- regList: [],
- changeTag: true,
- document: 'https://element.eleme.cn/#/zh-CN/component/select'
- },
- __slot__: {
- options: [{
- label: '选项一',
- value: 1
- }, {
- label: '选项二',
- value: 2
- }]
- },
- placeholder: '请选择',
- style: { width: '100%' },
- clearable: true,
- disabled: false,
- filterable: false,
- multiple: false
- },
- {
- __config__: {
- label: '级联选择',
- url: 'https://www.fastmock.site/mock/f8d7a54fb1e60561e2f720d5a810009d/fg/cascaderList',
- method: 'get',
- dataPath: 'list',
- dataConsumer: 'options',
- showLabel: true,
- labelWidth: null,
- tag: 'el-cascader',
- tagIcon: 'cascader',
- layout: 'colFormItem',
- defaultValue: [],
- dataType: 'dynamic',
- span: 24,
- required: true,
- regList: [],
- changeTag: true,
- document: 'https://element.eleme.cn/#/zh-CN/component/cascader'
- },
- options: [{
- id: 1,
- value: 1,
- label: '选项1',
- children: [{
- id: 2,
- value: 2,
- label: '选项1-1'
- }]
- }],
- placeholder: '请选择',
- style: { width: '100%' },
- props: {
- props: {
- multiple: false,
- label: 'label',
- value: 'value',
- children: 'children'
- }
- },
- 'show-all-levels': true,
- disabled: false,
- clearable: true,
- filterable: false,
- separator: '/'
- },
- {
- __config__: {
- label: '单选框组',
- labelWidth: null,
- showLabel: true,
- tag: 'el-radio-group',
- tagIcon: 'radio',
- changeTag: true,
- defaultValue: undefined,
- layout: 'colFormItem',
- span: 24,
- optionType: 'default',
- regList: [],
- required: true,
- border: false,
- document: 'https://element.eleme.cn/#/zh-CN/component/radio'
- },
- __slot__: {
- options: [{
- label: '选项一',
- value: 1
- }, {
- label: '选项二',
- value: 2
- }]
- },
- style: {},
- size: 'medium',
- disabled: false
- },
- {
- __config__: {
- label: '多选框组',
- tag: 'el-checkbox-group',
- tagIcon: 'checkbox',
- defaultValue: [],
- span: 24,
- showLabel: true,
- labelWidth: null,
- layout: 'colFormItem',
- optionType: 'default',
- required: true,
- regList: [],
- changeTag: true,
- border: false,
- document: 'https://element.eleme.cn/#/zh-CN/component/checkbox'
- },
- __slot__: {
- options: [{
- label: '选项一',
- value: 1
- }, {
- label: '选项二',
- value: 2
- }]
- },
- style: {},
- size: 'medium',
- min: null,
- max: null,
- disabled: false
- },
- {
- __config__: {
- label: '开关',
- tag: 'el-switch',
- tagIcon: 'switch',
- defaultValue: false,
- span: 24,
- showLabel: true,
- labelWidth: null,
- layout: 'colFormItem',
- required: true,
- regList: [],
- changeTag: true,
- document: 'https://element.eleme.cn/#/zh-CN/component/switch'
- },
- style: {},
- disabled: false,
- 'active-text': '',
- 'inactive-text': '',
- 'active-color': null,
- 'inactive-color': null,
- 'active-value': true,
- 'inactive-value': false
- },
- {
- __config__: {
- label: '滑块',
- tag: 'el-slider',
- tagIcon: 'slider',
- defaultValue: null,
- span: 24,
- showLabel: true,
- layout: 'colFormItem',
- labelWidth: null,
- required: true,
- regList: [],
- changeTag: true,
- document: 'https://element.eleme.cn/#/zh-CN/component/slider'
- },
- disabled: false,
- min: 0,
- max: 100,
- step: 1,
- 'show-stops': false,
- range: false
- },
- {
- __config__: {
- label: '时间选择',
- tag: 'el-time-picker',
- tagIcon: 'time',
- defaultValue: null,
- span: 24,
- showLabel: true,
- layout: 'colFormItem',
- labelWidth: null,
- required: true,
- regList: [],
- changeTag: true,
- document: 'https://element.eleme.cn/#/zh-CN/component/time-picker'
- },
- placeholder: '请选择',
- style: { width: '100%' },
- disabled: false,
- clearable: true,
- 'picker-options': {
- selectableRange: '00:00:00-23:59:59'
- },
- format: 'HH:mm:ss',
- 'value-format': 'HH:mm:ss'
- },
- {
- __config__: {
- label: '时间范围',
- tag: 'el-time-picker',
- tagIcon: 'time-range',
- span: 24,
- showLabel: true,
- labelWidth: null,
- layout: 'colFormItem',
- defaultValue: null,
- required: true,
- regList: [],
- changeTag: true,
- document: 'https://element.eleme.cn/#/zh-CN/component/time-picker'
- },
- style: { width: '100%' },
- disabled: false,
- clearable: true,
- 'is-range': true,
- 'range-separator': '至',
- 'start-placeholder': '开始时间',
- 'end-placeholder': '结束时间',
- format: 'HH:mm:ss',
- 'value-format': 'HH:mm:ss'
- },
- {
- __config__: {
- label: '日期选择',
- tag: 'el-date-picker',
- tagIcon: 'date',
- defaultValue: null,
- showLabel: true,
- labelWidth: null,
- span: 24,
- layout: 'colFormItem',
- required: true,
- regList: [],
- changeTag: true,
- document: 'https://element.eleme.cn/#/zh-CN/component/date-picker'
- },
- placeholder: '请选择',
- type: 'date',
- style: { width: '100%' },
- disabled: false,
- clearable: true,
- format: 'yyyy-MM-dd',
- 'value-format': 'yyyy-MM-dd',
- readonly: false
- },
- {
- __config__: {
- label: '日期范围',
- tag: 'el-date-picker',
- tagIcon: 'date-range',
- defaultValue: null,
- span: 24,
- showLabel: true,
- labelWidth: null,
- required: true,
- layout: 'colFormItem',
- regList: [],
- changeTag: true,
- document: 'https://element.eleme.cn/#/zh-CN/component/date-picker'
- },
- style: { width: '100%' },
- type: 'daterange',
- 'range-separator': '至',
- 'start-placeholder': '开始日期',
- 'end-placeholder': '结束日期',
- disabled: false,
- clearable: true,
- format: 'yyyy-MM-dd',
- 'value-format': 'yyyy-MM-dd',
- readonly: false
- },
- {
- __config__: {
- label: '评分',
- tag: 'el-rate',
- tagIcon: 'rate',
- defaultValue: 0,
- span: 24,
- showLabel: true,
- labelWidth: null,
- layout: 'colFormItem',
- required: true,
- regList: [],
- changeTag: true,
- document: 'https://element.eleme.cn/#/zh-CN/component/rate'
- },
- style: {},
- max: 5,
- 'allow-half': false,
- 'show-text': false,
- 'show-score': false,
- disabled: false
- },
- {
- __config__: {
- label: '颜色选择',
- tag: 'el-color-picker',
- tagIcon: 'color',
- span: 24,
- defaultValue: null,
- showLabel: true,
- labelWidth: null,
- layout: 'colFormItem',
- required: true,
- regList: [],
- changeTag: true,
- document: 'https://element.eleme.cn/#/zh-CN/component/color-picker'
- },
- 'show-alpha': false,
- 'color-format': '',
- disabled: false,
- size: 'medium'
- },
- {
- __config__: {
- label: '上传',
- tag: 'el-upload',
- tagIcon: 'upload',
- layout: 'colFormItem',
- defaultValue: null,
- showLabel: true,
- labelWidth: null,
- required: true,
- span: 24,
- showTip: false,
- buttonText: '点击上传',
- regList: [],
- changeTag: true,
- fileSize: 2,
- sizeUnit: 'MB',
- document: 'https://element.eleme.cn/#/zh-CN/component/upload'
- },
- __slot__: {
- 'list-type': true
- },
- // action: process.env.VUE_APP_BASE_API + "/admin-api/infra/file/upload", // 请求地址
- action: '/infra/file/upload', // 请求地址
- disabled: false,
- accept: '',
- name: 'file',
- 'auto-upload': true,
- 'list-type': 'text',
- multiple: false
- }
- ]
- // 布局型组件 【左面板】
- export const layoutComponents = [
- {
- __config__: {
- layout: 'rowFormItem',
- tagIcon: 'row',
- label: '行容器',
- layoutTree: true,
- document: 'https://element.eleme.cn/#/zh-CN/component/layout#row-attributes'
- },
- type: 'default',
- justify: 'start',
- align: 'top'
- },
- {
- __config__: {
- label: '按钮',
- showLabel: true,
- changeTag: true,
- labelWidth: null,
- tag: 'el-button',
- tagIcon: 'button',
- span: 24,
- layout: 'colFormItem',
- document: 'https://element.eleme.cn/#/zh-CN/component/button'
- },
- __slot__: {
- default: '主要按钮'
- },
- type: 'primary',
- icon: 'el-icon-search',
- round: false,
- size: 'medium',
- plain: false,
- circle: false,
- disabled: false
- },
- {
- __config__: {
- layout: 'colFormItem',
- tagIcon: 'table',
- tag: 'el-table',
- document: 'https://element.eleme.cn/#/zh-CN/component/table',
- span: 24,
- formId: 101,
- renderKey: 1595761764203,
- componentName: 'row101',
- showLabel: true,
- changeTag: true,
- labelWidth: null,
- label: '表格[开发中]',
- dataType: 'dynamic',
- method: 'get',
- dataPath: 'list',
- dataConsumer: 'data',
- url: 'https://www.fastmock.site/mock/f8d7a54fb1e60561e2f720d5a810009d/fg/tableData',
- children: [{
- __config__: {
- layout: 'raw',
- tag: 'el-table-column',
- renderKey: 15957617660153
- },
- prop: 'date',
- label: '日期'
- }, {
- __config__: {
- layout: 'raw',
- tag: 'el-table-column',
- renderKey: 15957617660152
- },
- prop: 'address',
- label: '地址'
- }, {
- __config__: {
- layout: 'raw',
- tag: 'el-table-column',
- renderKey: 15957617660151
- },
- prop: 'name',
- label: '名称'
- }, {
- __config__: {
- layout: 'raw',
- tag: 'el-table-column',
- renderKey: 1595774496335,
- children: [
- {
- __config__: {
- label: '按钮',
- tag: 'el-button',
- tagIcon: 'button',
- layout: 'raw',
- renderKey: 1595779809901
- },
- __slot__: {
- default: '主要按钮'
- },
- type: 'primary',
- icon: 'el-icon-search',
- round: false,
- size: 'medium'
- }
- ]
- },
- label: '操作'
- }]
- },
- data: [],
- directives: [{
- name: 'loading',
- value: true
- }],
- border: true,
- type: 'default',
- justify: 'start',
- align: 'top'
- }
- ]
|