diff --git a/src/components/DesignForm/formControlAttr.vue b/src/components/DesignForm/formControlAttr.vue index 10b9350f3..1212eed6a 100644 --- a/src/components/DesignForm/formControlAttr.vue +++ b/src/components/DesignForm/formControlAttr.vue @@ -21,11 +21,10 @@ import { uploadUrl } from '@/api/DesignForm' import { UploadFilled } from '@element-plus/icons-vue' import { UploadFile, UploadFiles } from 'element-plus/es/components/upload/src/upload'; - + import type Node from 'element-plus/es/components/tree/src/model/node' //样式布局 import LayoutPage from '@/components/DesignForm/layoutPage/index.vue' -<<<<<<< HEAD import { Plus } from '@element-plus/icons-vue' @@ -973,31 +972,7 @@ const newVal = obj.isNum ? formatNumber(val) : val // 类型为数字时转整数 obj.path && getPropByPath(controlData.value, obj.path, newVal) } -======= -import { chineseToPinyin } from '@/api/DesignForm/requestapi' - -import { uploadUrl } from '@/api/DesignForm' -import { UploadFilled } from '@element-plus/icons-vue' -import { UploadFile, UploadFiles } from 'element-plus/es/components/upload/src/upload'; -import type Node from 'element-plus/es/components/tree/src/model/node' - -const props = withDefaults( //接收父级参数 - defineProps<{ - formData: any - formConfig: any - formOtherData: any - customerformid: number | string, - }>(), - { - formConfig: () => { - return {} - }, - formOtherData: () => { - // 其他不需要保存在formData里的数据 - return {} - } ->>>>>>> liwenxuan_v4 } /** * 获取非负整数随机数 @@ -1550,7 +1525,7 @@ const props = withDefaults( //接收父级参数 { label: '每行三列', value: 'form-row-3' }, { label: '每行四列', value: 'form-row-4' } ] -<<<<<<< HEAD + const layouytStyle = reactive(controlData.value.styles) watch(()=>layouytStyle,(val : any)=>{ @@ -1575,745 +1550,6 @@ const props = withDefaults( //接收父级参数 return true; } return false; -======= -}) -const attrList = computed(() => { - if (Object.keys(controlData.value).length) { - const { - control = {}, - type, - name, - config = {}, - item = {}, - attr = {} - }: { control: any;type:any;name:any;item:any;attr:any; config: any } = controlData.value - let columnIndex = false // 是否显示序号列 - if (type === 'table') { - // 表格时处理 - const list = controlData.value && controlData.value.list - if (list && list.length > 0) { - columnIndex = list[0].type === 'index' - } - } - - const temp =reactive([ - { - label: '自定义Class', - value: config.className, - placeholder: '样式类名', - path: 'config.className' - }, - { - label: '字段标识', - value: name, - type: - Object.keys(state.dataSourceList).length > 0 ? 'select' : 'text', - placeholder: '字段唯一标识,对应数据库', - dict: state.dataSourceList, - path: 'name', - vHide: [ - 'grid', - 'tabs', - 'card', - 'title', - 'gridChild', - 'tableColumn', - 'divider', - 'txt', - 'div', - 'button' - ], - eventName: 'filedNameKey' - }, - { - label: '占位内容', - value: control.placeholder, - placeholder: 'placeholder', - path: 'control.placeholder', - vShow: [ - 'password', - 'input', - 'textarea', - 'select', - 'date', - 'number', - 'datePicker', - 'tinymce', - 'timePicker', - 'treeSelect' - ] - }, - { - label: '按钮类型', - value: control.type, - path: 'control.type', - type: 'select', - dict: { - primary: 'primary', - success: 'success', - info: 'info', - warning: 'warning', - danger: 'danger' - }, - vShow: ['button'], - clearable: true - }, - { - label: '按钮名称', - value: control.label, - path: 'control.label', - vShow: ['button'] - }, - { - label: '按钮事件', - value: control.key, - path: 'control.key', - type: 'select', - dict: { - submit: '提交表单', - reset: '重置表单', - cancel: '取消返回', - none: '无动作(自定义)' - }, - vShow: ['button'] - }, - { - label: '对齐方式', - value: config.textAlign, - path: 'config.textAlign', - type: 'select', - dict: { - left: 'left', - right: 'right', - center: 'center' - }, - vShow: ['button', 'div'] - }, - { - label: 'label值', - value: item.label, - path: 'item.label', - vHide: [ - 'table', - 'grid', - 'tabs', - 'title', - 'gridChild', - 'div', - 'inputSlot', - 'flex', - 'button', - 'txt' - ], - eventName: 'labelNameVal' - }, - { - label: '隐藏label', - value: item.showLabel, - path: 'item.showLabel', - type: 'switch', - vHide: [ - 'table', - 'grid', - 'tabs', - 'title', - 'gridChild', - 'divider', - 'card', - 'div', - 'inputSlot', - 'flex', - 'button', - 'txt' - ] - }, - { - label: '帮助信息', - value: config.help, - path: 'config.help', - vHide: [ - 'table', - 'grid', - 'tabs', - 'gridChild', - 'divider', - 'div', - 'inputSlot', - 'flex', - 'button', - 'txt' - ] - }, - { - label: '表单栅格', - value: config.span, - placeholder: '表单区域栅格宽,0为自动宽', - path: 'config.span', - vHide: ['gridChild'], - isNum: true - }, - /*{ - label: '行类样式', - value: config.inline, - type: 'switch', - path: 'config.inline', - vShow: ['div'] - },*/ - { - label: '文本值', - value: control.modelValue, - placeholder: '支持html', - path: 'control.modelValue', - vShow: ['txt'], - inputStyle: 'textarea' - }, - { - label: '设为密码', - value: type, - type: 'select', - dict: { input: '文本', password: '密码' }, - path: 'type', - vShow: ['input', 'password'], - vIf: state.isSearch // 搜索模式下隐藏 为true - }, - { - label: '文本域高度', - value: control.rows, - placeholder: '输入框行数', - path: 'control.rows', - vShow: ['textarea'], - isNum: true - }, - { - label: '前缀', - value: config.prepend, - placeholder: '文本前缀', - path: 'config.prepend', - vShow: ['input', 'password'] - }, - { - label: '后缀', - value: config.append, - placeholder: '文本后缀', - path: 'config.append', - vShow: ['input', 'password'] - }, - { - label: '状态打开时的值', - value: control.activeValue, - placeholder: '状态打开时的值', - path: 'control.activeValue', - vShow: ['switch'], - isNum: true - }, - { - label: '状态关闭时的值', - value: control.inactiveValue, - placeholder: '状态关闭时的值', - path: 'control.inactiveValue', - vShow: ['switch'], - isNum: true - }, - // { - // label: '转换格式化值', - // value: config.transform, - // path: 'config.transform', - // type: 'switch', - // vShow: [ - // 'checkbox', - // 'select', - // 'switch', - // 'cascader', - // 'slider', - // 'table', - // 'flex', - // 'treeSelect' - // ] - // }, - { - label: '增加按钮文案', - value: config.addBtnText, - path: 'config.addBtnText', - type: 'text', - vShow: ['flex', 'table'] - }, - { - label: '删除按钮文案', - value: config.delBtnText, - path: 'config.delBtnText', - type: 'text', - vShow: ['flex', 'table'] - }, - { - label: '是否多选', - value: control.multiple, - path: 'control.multiple', - type: 'switch', - vShow: ['select', 'treeSelect'], - eventName: 'selectMultiple' - }, - { - label: '可清空', - value: control.clearable, - path: 'control.clearable', - type: 'switch', - vShow: ['select'] - }, - { - label: '是否禁用', - value: control.disabled, - path: 'control.disabled', - type: 'switch', - vShow: [ - 'input', - 'password', - 'textarea', - 'radio', - 'checkbox', - 'select', - 'date', - 'switch', - 'number', - 'cascader', - 'upload', - 'rate', - 'tinymce', - 'treeSelect' - ], - vIf: state.isSearch - }, - { - label: '是否禁用编辑', - value: config.editDisabled, - path: 'config.editDisabled', - type: 'switch', - vShow: [ - 'input', - 'password', - 'textarea', - 'radio', - 'checkbox', - 'select', - 'date', - 'switch', - 'number', - 'cascader', - 'upload', - 'treeSelect', - 'table', - 'flex' - ], - vIf: state.isSearch - }, - { - label: '添加页隐藏', - value: config.disabledAdd, - path: 'config.disabledAdd', - type: 'switch', - vIf: state.isSearch, - vHide: ['inputSlot'] - }, - { - label: '编辑页隐藏', - value: config.disabledEdit, - path: 'config.disabledEdit', - type: 'switch', - vIf: state.isSearch, - vHide: ['inputSlot'] - }, - { - label: '详情页隐藏', - value: config.disabledDetail, - path: 'config.disabledDetail', - type: 'switch', - vIf: state.isSearch, - vHide: ['inputSlot'] - }, - { - label: '设为Input输入框的前/后缀', - value: type === 'inputSlot', - path: '', - type: 'switch', - vShow: ['select', 'inputSlot'], - eventName: 'setInputSlot' - }, - { - label: '标题', - value: control.modelValue, - path: 'control.modelValue', - vShow: ['title'] - }, - { - label: '占据的列数span', - value: attr.span, - path: 'attr.span', - vShow: ['gridChild'], - eventName: 'formatNumber', - isNum: true - }, - { - label: '左侧的间隔格数offset', - value: attr.offset, - path: 'attr.offset', - vShow: ['gridChild'], - eventName: 'formatNumber', - isNum: true - }, - { - label: '向右移动格数push', - value: attr.push, - path: 'attr.push', - vShow: ['gridChild'], - eventName: 'formatNumber', - isNum: true - }, - { - label: '向左移动格数pull', - value: attr.pull, - path: 'attr.pull', - vShow: ['gridChild'], - eventName: 'formatNumber', - isNum: true - }, - { - label: '序号列', - value: columnIndex, - type: 'switch', - vShow: ['table'], - eventName: 'tableColumn1' - }, - /*{ - label: '操作列', - value: columnOperate, - type: 'switch', - vShow: ['table'], - eventName: 'tableColumn2' - },*/ - { - label: '组件名', - value: config.componentName, - placeholder: '全局注册的组件名称', - path: 'config.componentName', - vShow: ['component'] - }, - { - label: '上传图片', - value: config.lowcodeImage, - path: 'config.lowcodeImage', - type: 'lowcodeImage_url', - vIf: state.isSearch, - vShow: ['lowcodeImage'] - }, - { - label: '尺寸', - value: config.lowcodeImage, - path: 'config.lowcodeImage', - type: 'lowcodeImage_showMode', - vIf: state.isSearch, - vShow: ['lowcodeImage'] - }, - { - label: '契合度', - value: config.lowcodeImage, - path: 'config.lowcodeImage', - type: 'lowcodeImage_fit', - vIf: state.isSearch, - vShow: ['lowcodeImage'] - }, - { - label: '圆角', - value: config.lowcodeImage, - path: 'config.lowcodeImage', - type: 'lowcodeImage_radius', - vIf: state.isSearch, - vShow: ['lowcodeImage'] - }, - { - label: '边框和阴影', - value: config.lowcodeImage, - path: 'config.lowcodeImage', - type: 'lowcodeImage_boderAndShadow', - vIf: state.isSearch, - vShow: ['lowcodeImage'] - }, - { - label: '图片链接', - value: config.lowcodeImage, - path: 'config.lowcodeImage', - type: 'lowcodeImage_link', - vIf: state.isSearch, - vShow: ['lowcodeImage'] - }, - { - label: '浮动', - value: config.lowcodeImage, - path: 'config.lowcodeImage', - type: 'lowcodeImage_float', - vIf: state.isSearch, - vShow: ['lowcodeImage'] - }, - { - label: '内外四边距', - value: config.lowcodeImage, - path: 'config.lowcodeImage', - type: 'lowcodeImage_marginAndPadding', - vIf: state.isSearch, - vShow: ['lowcodeImage'] - }, - { - label: '轮播图设置', - value: config.carousel, - path: 'config.carousel', - type: 'carousel', - vIf: state.isSearch, - vShow: ['lowcodeCarsusel'] - }, - { - label: '穿梭框名', - value: config.transfer, - path: 'config.transfer', - type: 'transfer_name', - vIf: state.isSearch, - vShow: ['lowcodeTransfer'] - }, - { - label: '选项数据源', - value: config.transfer, - path: 'config.transfer', - type: 'transfer_options_datasource', - vIf: state.isSearch, - vShow: ['lowcodeTransfer'] - }, - - - { - label: '上传视频', - value: config.uploadvideo, - path: 'config.uploadvideo', - type: 'uploadvideo_url', - vIf: state.isSearch, - vShow: ['videoUpAndPlay'] - }, - /* { - label: '上传视频封面', - value: config.uploadvideo, - path: 'config.uploadvideo', - type: 'uploadvideo_poster', - vIf: state.isSearch, - vShow: ['videoUpAndPlay'] - }, */ - { - label: '视频宽度(像素)', - value: config.uploadvideo, - path: 'config.uploadvideo', - type: 'uploadvideo_width', - vIf: state.isSearch, - vShow: ['videoUpAndPlay'] - }, - { - label: '视频高度(像素)', - value: config.uploadvideo, - path: 'config.uploadvideo', - type: 'uploadvideo_height', - vIf: state.isSearch, - vShow: ['videoUpAndPlay'] - }, - { - label: '视频自动播放', - value: config.uploadvideo, - path: 'config.uploadvideo', - type: 'uploadvideo_autoPlay', - vIf: state.isSearch, - vShow: ['videoUpAndPlay'] - }, - { - label: '视频循环播放', - value: config.uploadvideo, - path: 'config.uploadvideo', - type: 'uploadvideo_loopPlay', - vIf: state.isSearch, - vShow: ['videoUpAndPlay'] - }, - - - { - label: '上传地址', - value: control.action, - placeholder: '图片/文件上传地址,可不填有默认值', - path: 'control.action', - vShow: ['upload'] - }, - { - label: '文件字段名', - value: control.name, - placeholder: '上传的文件字段名,默认file', - path: 'control.name', - vShow: ['upload'] - }, - { - label: '列表类型', - value: control.listType, - type: 'select', - dict: { - text: 'text', - picture: 'picture', - 'picture-card': 'picture-card' - }, - path: 'control.listType', - vShow: ['upload'] - }, - { - label: '提示文字', - value: config.tip, - placeholder: '提示说明文字', - path: 'config.tip', - vShow: ['upload'] - }, - { - label: '按钮文本', - value: config.btnText, - placeholder: '上传按钮文本', - path: 'config.btnText', - vShow: ['upload'] - }, - { - label: 'direction', - type: 'select', - dict: { horizontal: 'horizontal', vertical: 'vertical' }, - placeholder: '分割线方向,默认horizontal', - value: control.direction, - path: 'control.direction', - vShow: ['divider'] - }, - { - label: 'border-style', - placeholder: '分隔符样式,默认solid', - value: control.borderStyle, - path: 'control.borderStyle', - vShow: ['divider'] - }, - { - label: 'content-position', - type: 'select', - dict: { left: 'left', right: 'right', center: 'center' }, - value: control.contentPosition, - path: 'control.contentPosition', - vShow: ['divider'] - }, - { - label: '最小值', - value: control.min, - path: 'control.min', - vShow: ['slider'], - eventName: 'formatNumber', - isNum: true - }, - { - label: '最大值', - value: control.max, - path: 'control.max', - vShow: ['rate', 'slider'], - eventName: 'formatNumber', - isNum: true - }, - { - label: '步长', - value: control.step, - path: 'control.step', - vShow: ['slider'], - eventName: 'formatNumber', - isNum: true - }, - { - label: 'type', - value: control.type, - path: 'control.type', - vShow: ['datePicker'], - type: 'select', - placeholder: '显示类型', - dict: { - year: 'year', - month: 'month', - date: 'date', - datetime: 'datetime', - week: 'week', - datetimerange: 'datetimerange', - daterange: 'daterange', - monthrange: 'monthrange' - } - }, - { - label: 'format', - value: control.format, - path: 'control.format', - vShow: ['datePicker', 'timePicker'], - placeholder: '显示在输入框中的格式' - }, - { - label: 'color-format', - value: control.colorFormat, - path: 'control.colorFormat', - type: 'select', - placeholder: '写入 v-model 的颜色的格式', - dict: { hsl: 'hsl', hsv: 'hsv', hex: 'hex', rgb: 'rgb' }, - vShow: ['colorPicker'] - }, - { - label: '文本高度', - value: control.height, - path: 'control.height', - placeholder: '文本高度(预览查看效果)', - vShow: ['tinymce'] - }, - { - label: '文本宽度', - value: control.width, - path: 'control.width', - placeholder: '文本宽度(预览查看效果)', - vShow: ['tinymce'] - }, - { - label: '图片上传地址', - value: control.imgUrl, - path: 'control.imgUrl', - placeholder: '图片上传地址', - vShow: ['tinymce'] - }, - { - label: '附件上传地址', - value: control.blobUrl, - path: 'control.blobUrl', - placeholder: '附件上传地址', - vShow: ['tinymce'] - }, - { - label: '显示模式', - value: config.style, - path: 'config.style', - placeholder: '显示风格(预览查看效果)', - type: 'select', - dict: { default: 'default', simple: 'simple' }, - vShow: ['tinymce'] - } - ]) - // 过滤显示对应的值 - return temp.filter((item: any) => { - let hasFilter = true - if (item.vShow) { - hasFilter = item.vShow.includes(type) - } - if (item.vHide) { - hasFilter = !item.vHide.includes(type) - } - if (item.vIf) { - // 不显示vif=true的 - hasFilter = false - } - return hasFilter - }) - } else { - return [] ->>>>>>> liwenxuan_v4 } /** @ 作者: 秦东 @@ -2343,7 +1579,7 @@ const beforeAvatarUpload: UploadProps['beforeUpload'] = (rawFile) => { -<<<<<<< HEAD +