From c485d6eb5c8e3869925a69a88ebd49466933a96a Mon Sep 17 00:00:00 2001 From: liwenxuan <1298531568@qq.com> Date: Thu, 7 Mar 2024 12:10:21 +0800 Subject: [PATCH] =?UTF-8?q?=E6=A0=91=E7=A9=BF=E6=A2=AD=E6=A1=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/DesignForm/assembly/index.ts | 27 ++ src/components/DesignForm/formControlAttr.vue | 227 +++++++++- .../DesignForm/public/form/formGroup.vue | 1 + src/widget/index.ts | 2 + src/widget/lowcodetransfer/index.vue | 181 ++++++++ .../lowcodetransfer/lowcodeTransfer.vue | 393 ++++++++++++++++++ 6 files changed, 828 insertions(+), 3 deletions(-) create mode 100644 src/widget/lowcodetransfer/index.vue create mode 100644 src/widget/lowcodetransfer/lowcodeTransfer.vue diff --git a/src/components/DesignForm/assembly/index.ts b/src/components/DesignForm/assembly/index.ts index 63b132672..13de4cf23 100644 --- a/src/components/DesignForm/assembly/index.ts +++ b/src/components/DesignForm/assembly/index.ts @@ -358,6 +358,33 @@ const selectOption: any = [ } }, config: {} + }, + { + type: 'lowcodeTransfer', + label: '穿梭框', + icon: '', + iconFont: 'fa-arrows-h', + control: { + modelValue: '', + fixedOptions: [{ + id: 'thefirstrootnode', + label: '根节点1', + disabled: false, + children: [] + }, + { + id: 'thesecondrootnode', + label: '根节点2', + disabled: false, + children: [] + }] + }, + config: { + transferName:'穿梭框', + transferDataSource:'固定选项', + apiUrl:'', + method:'', + } } ] }, diff --git a/src/components/DesignForm/formControlAttr.vue b/src/components/DesignForm/formControlAttr.vue index 355341119..718d08faa 100644 --- a/src/components/DesignForm/formControlAttr.vue +++ b/src/components/DesignForm/formControlAttr.vue @@ -18,6 +18,8 @@ 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 @@ -598,6 +600,24 @@ const attrList = computed(() => { 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, @@ -1333,6 +1353,9 @@ import { v4 as uuidv4 } from "uuid"; //轮播图设置弹窗显示控制 const dialogTableVisible = ref(false) +//穿梭框设置弹窗显示控制 +const transferDialogTableVisible = ref(false) + //图片展示显示控制 const showImagePreview = ref(false) @@ -1421,6 +1444,96 @@ const changeCurrentUploadImgid = (clickedRow:any) => { //liwenxuan 20240111 carousel end +//liwenxuan 20240217 transfer start + +const transferDataSourceOptions = [ + { + value: '数据源', + label: '数据源', + }, + { + value: '固定选项', + label: '固定选项', + }, +] + + + +//!!!!!!!!!!!!!!!树数据start + + +const dataSource = ref([]) +interface Tree { + id: string + label: string + disabled: boolean + children?: Tree[] +} + +const addRootNode = () => { + let onlyNumber = uuidv4().replaceAll('-','').toString(); + controlData.value.control.fixedOptions.push({ + id: onlyNumber, + label: '新根节点', + disabled: false, + children: [], + }) +} + +const append = (data: Tree) => { + let onlyNumber = uuidv4().replaceAll('-','').toString(); + const newChild = { id: onlyNumber, label: '新节点', disabled:false,children: [] } + if (!data.children) { + data.children = [] + } + data.children.push(newChild) + dataSource.value = [...dataSource.value] +} + +const remove = (node: Node, data: Tree) => { + let really = confirm("确认删除吗?\n将删除本节点与本节点的所有子孙节点!"); + if(really){ + const parent = node.parent + const children: Tree[] = parent.data.children || parent.data + const index = children.findIndex((d) => d.id === data.id) + children.splice(index, 1) + dataSource.value = [...dataSource.value] + } + +} + + + +const changeLabel = (node:Node,data:Tree) =>{ + let favDrink = prompt("请输入:"); + if(favDrink!=null && favDrink.length>0){ + const parent = node.parent + const children: Tree[] = parent.data.children || parent.data + const index = children.findIndex((d) => d.id === data.id) + children[index].label = favDrink + dataSource.value = [...dataSource.value] + } + + +} + +const setNodeEnable = (node:Node,data:Tree) =>{ + const parent = node.parent + const children: Tree[] = parent.data.children || parent.data + const index = children.findIndex((d) => d.id === data.id) + children[index].disabled = !children[index].disabled + dataSource.value = [...dataSource.value] + +} + + + + + +//!!!!!!!!!!!!!!!树数据end + + +//liwenxuan 20240217 transfer end + diff --git a/src/widget/index.ts b/src/widget/index.ts index ae9f5da86..f54682139 100644 --- a/src/widget/index.ts +++ b/src/widget/index.ts @@ -9,6 +9,7 @@ import orgCentent from './org/index.vue' import signatureMap from './writingboard/index.vue' import videoUpAndPlay from './videoupload/index.vue' import lowcodeCarsusel from './carousel/index.vue' +import lowcodeTransfer from './lowcodetransfer/index.vue' export default (app: any) => { app.component('SerialNumber', serialNumber) @@ -19,4 +20,5 @@ export default (app: any) => { app.component('SignatureMap', signatureMap) app.component('VideoUpAndPlay',videoUpAndPlay) app.component('LowcodeCarsusel',lowcodeCarsusel) + app.component('LowcodeTransfer',lowcodeTransfer) } diff --git a/src/widget/lowcodetransfer/index.vue b/src/widget/lowcodetransfer/index.vue new file mode 100644 index 000000000..9c976bf39 --- /dev/null +++ b/src/widget/lowcodetransfer/index.vue @@ -0,0 +1,181 @@ + + + + \ No newline at end of file diff --git a/src/widget/lowcodetransfer/lowcodeTransfer.vue b/src/widget/lowcodetransfer/lowcodeTransfer.vue new file mode 100644 index 000000000..67fd11377 --- /dev/null +++ b/src/widget/lowcodetransfer/lowcodeTransfer.vue @@ -0,0 +1,393 @@ + + + + + + + +