From ff593de35768c054d13f6a24dd84814c79b53105 Mon Sep 17 00:00:00 2001 From: liwenxuan <1298531568@qq.com> Date: Fri, 15 Mar 2024 14:26:25 +0800 Subject: [PATCH] =?UTF-8?q?=E5=9B=BE=E7=89=87?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/DesignForm/assembly/index.ts | 37 ++- src/components/DesignForm/formControlAttr.vue | 271 +++++++++++++++++- .../DesignForm/public/form/formGroup.vue | 1 + src/widget/index.ts | 2 + .../lowcodetransfer/lowcodeTransfer.vue | 6 +- 5 files changed, 307 insertions(+), 10 deletions(-) diff --git a/src/components/DesignForm/assembly/index.ts b/src/components/DesignForm/assembly/index.ts index 4b820e517..890fb7f22 100644 --- a/src/components/DesignForm/assembly/index.ts +++ b/src/components/DesignForm/assembly/index.ts @@ -291,7 +291,7 @@ const selectOption: any = [ type: 'upload', label: '图片/文件', icon: 'image', - iconFont: 'fa-photo', + iconFont: 'fa-file-image-o', control: { modelValue: '' // 也可以是[{name:'',url:''}]形式 }, @@ -385,7 +385,40 @@ const selectOption: any = [ apiUrl:'/javasys/lowCode/transfer/getOrgAndManTree', method:'post', } - } + }, + { + type: 'lowcodeImage', + label: '图片', + icon: '', + iconFont: 'fa-photo', + control: { + modelValue: '', + uploadFlag:false, + imgId:'', + imgUrl: '', + link: '', + fit:1, + radius:false, + radiusNum:5, + boderAndShadow:false, + showMode:'自定义像素值', + pxWidth:448, + pxHeight:252, + widthPercent:90, + heightPercent:90, + mt:0, + mb:0, + ml:0, + mr:0, + pt:0, + pb:0, + pl:0, + pr:0, + floatFlag:false, + floatValue:'left', + }, + config: {} + }, ] }, { diff --git a/src/components/DesignForm/formControlAttr.vue b/src/components/DesignForm/formControlAttr.vue index 718d08faa..01ffb6852 100644 --- a/src/components/DesignForm/formControlAttr.vue +++ b/src/components/DesignForm/formControlAttr.vue @@ -592,6 +592,70 @@ const attrList = computed(() => { 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, @@ -1446,14 +1510,25 @@ const changeCurrentUploadImgid = (clickedRow:any) => { //liwenxuan 20240217 transfer start -const transferDataSourceOptions = [ +const showModeSelectOptions = [ { - value: '数据源', - label: '数据源', + value: '自定义像素值', + label: '自定义像素值', }, { - value: '固定选项', - label: '固定选项', + value: '自定义占父容器比例', + label: '自定义占父容器比例', + }, +] + +const floatSelectOptions = [ + { + value: 'left', + label: '左', + }, + { + value: 'right', + label: '右', }, ] @@ -1535,6 +1610,32 @@ const setNodeEnable = (node:Node,data:Tree) =>{ //liwenxuan 20240217 transfer end + +//liwenxuan20240313 lowcodeImage start + +//图片上传成功钩子 +function lowcodeImageUploadSuccess(response: any, uploadFile: UploadFile, uploadFiles: UploadFiles){ + const element = controlData.value.control + element.imgUrl=response.data.url + element.uploadFlag=true +} + +// +const transferDataSourceOptions = [ + { + value: '数据源', + label: '数据源', + }, + { + value: '固定选项', + label: '固定选项', + }, +] + +//const radio = ref(controlData.value.control.fit) + +//liwenxuan20240313 lowcodeImage end + + diff --git a/src/widget/index.ts b/src/widget/index.ts index f54682139..fadb83609 100644 --- a/src/widget/index.ts +++ b/src/widget/index.ts @@ -10,6 +10,7 @@ import signatureMap from './writingboard/index.vue' import videoUpAndPlay from './videoupload/index.vue' import lowcodeCarsusel from './carousel/index.vue' import lowcodeTransfer from './lowcodetransfer/index.vue' +import lowcodeImage from './lowcodeimage/index.vue' export default (app: any) => { app.component('SerialNumber', serialNumber) @@ -21,4 +22,5 @@ export default (app: any) => { app.component('VideoUpAndPlay',videoUpAndPlay) app.component('LowcodeCarsusel',lowcodeCarsusel) app.component('LowcodeTransfer',lowcodeTransfer) + app.component('LowcodeImage',lowcodeImage) } diff --git a/src/widget/lowcodetransfer/lowcodeTransfer.vue b/src/widget/lowcodetransfer/lowcodeTransfer.vue index 060d8faee..ca14c428e 100644 --- a/src/widget/lowcodetransfer/lowcodeTransfer.vue +++ b/src/widget/lowcodetransfer/lowcodeTransfer.vue @@ -72,7 +72,7 @@ checkedIdList = []; const url = transferConfig.apiUrl;/* '/javasys/lowCode/transfer/getOrgAndManTree' */ function getDetail() { - console.log(11111) + //console.log(11111) if(transferConfig.transferDataSource==="数据源"){ return request({ url: url, @@ -82,7 +82,7 @@ function getDetail() { } if(transferConfig.transferDataSource==="数据源"){ getDetail().then(({ data }) => { - console.log(`获取穿梭框接口数据`); + //console.log(`获取穿梭框接口数据`); let resData = ref(data.children) // 全选方法2:插入 全选node userList.value = [{ @@ -302,7 +302,7 @@ if(transferConfig.transferDataSource==="固定选项"){ label: '全选', children: fixedOptions }] - console.log(treeRef) + //console.log(treeRef) treeRef.value.setCheckedKeys(checkedIdList,true) setTimeout(() => {