From d37ce26dd6e4e7fcaca258b6ed753030ed85440f Mon Sep 17 00:00:00 2001
From: liwenxuan <1298531568@qq.com>
Date: Thu, 10 Oct 2024 16:55:08 +0800
Subject: [PATCH] =?UTF-8?q?=E7=A9=BF=E6=A2=AD=E6=A1=86=E6=8F=90=E4=BA=A4?=
 =?UTF-8?q?=E6=97=A0=E5=80=BC----bug=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/DesignForm/assembly/index.ts   |   2 +-
 src/widget/associatedforms/index.vue          |   1 +
 src/widget/lowcodetransfer/index.vue          |  93 ++++++++++-
 .../lowcodetransfer/lowcodeTransfer.vue       | 151 ++++++++++++++++--
 4 files changed, 231 insertions(+), 16 deletions(-)

diff --git a/src/components/DesignForm/assembly/index.ts b/src/components/DesignForm/assembly/index.ts
index 9c18743..9487aec 100644
--- a/src/components/DesignForm/assembly/index.ts
+++ b/src/components/DesignForm/assembly/index.ts
@@ -813,7 +813,7 @@ export default [
 				icon: '',
 				iconFont: 'fa-arrows-h',
 				control: {
-					modelValue: '',
+					modelValue: [],
 					fixedOptions: [{
 						id: 'thefirstrootnode',
 						label: '根节点1',
diff --git a/src/widget/associatedforms/index.vue b/src/widget/associatedforms/index.vue
index 212babb..537d2d6 100644
--- a/src/widget/associatedforms/index.vue
+++ b/src/widget/associatedforms/index.vue
@@ -68,6 +68,7 @@ const value = computed({
     }
 })
 const updateModel = (val: any) => {
+	console.log("dfsasdfasdf")
 	let controlAttribute = ""
 	if(props.data.control){
 		if(props.data.control.type){
diff --git a/src/widget/lowcodetransfer/index.vue b/src/widget/lowcodetransfer/index.vue
index 9c976bf..a3c8d16 100644
--- a/src/widget/lowcodetransfer/index.vue
+++ b/src/widget/lowcodetransfer/index.vue
@@ -14,7 +14,7 @@
         <input  v-model="value" type="hidden" >
     </el-form-item>
 
-    <LowcodeTransfer :data="props.data"></LowcodeTransfer>
+    <LowcodeTransfer :data="props.data" :selected-value="value" @checked-id-list-changed="checkedIdListChangedIndex" @update-model="updateModel" ></LowcodeTransfer>
 </template>
 <script lang='ts' setup>
 import LowcodeTransfer   from './lowcodeTransfer.vue';
@@ -34,10 +34,15 @@ const props = withDefaults(
     }>(),
     {}
 )
+
 const emits = defineEmits<{
     (e: 'update:modelValue', numVal: any): void
 }>()
 
+function checkedIdListChangedIndex(val:any){
+	//console.log(val)
+	value.value = val
+}
 const formProps = inject(constFormProps, {}) as any
 const type = computed(() => {
     return formProps.value.type
@@ -48,23 +53,107 @@ const config = computed(() => {
 
 const changeEvent = inject(constControlChange, '') as any
 
+const parsedData = ref<any[]>([])
+
+
+
 const value = computed({
     get() {
+		
 		if (props.tProp) {
+			//console.log("a")
 			// 表格和弹性布局
 			return props.modelValue
 		} else {
-			return formProps.value.model[props.data.name]
+			/* console.log(formProps.value.model)
+			console.log(props.data.name)
+			console.log(formProps.value.model[props.data.name]) */
+			nextTick(()=>{
+				if(formProps.value.model[props.data.name]&&formProps.value.model[props.data.name] != ""&&parsedData.value.length==0){
+					parsedData.value = JSON.parse(formProps.value.model[props.data.name]);
+				}
+			})
+			
+			// eslint-disable-next-line vue/no-side-effects-in-computed-properties
+			// parsedData.value = arr
+			
+			return parsedData.value
+			//return formProps.value.model[props.data.name]
 		}
     },
     set(newVal: any) {
+		//console.log(newVal)
 		if (props.tProp) {
 			emits('update:modelValue', newVal)
 		}
 		updateModel(newVal)
     }
 })
+function waitModelHasValue(){
+	//console.log("waitModelHasValue")
+	setTimeout(()=>{
+		if(formProps.value.model&&formProps.value.model.creater){
+					/* console.log(formProps.value.model[props.data.name])
+					console.log(formProps.value.model)
+					console.log(props.data.name) */
+					/* nextTick(()=>{
+						if(formProps.value.model[props.data.name]&&formProps.value.model[props.data.name] != ""&&parsedData.value.length==0){
+							parsedData.value = JSON.parse(formProps.value.model[props.data.name]);
+						}
+					}) */
+					if(formProps.value.model[props.data.name]){
+						//console.log(formProps.value.model[props.data.name])
+						parsedData.value = JSON.parse(formProps.value.model[props.data.name]);
+					}
+					
+					//console.log("的发生范德萨范德萨富士达"+parsedData.value)
+					value.value = parsedData.value
+				}else{
+					waitModelHasValue()
+				}
+	},500)
+	
+}
+
+
+onMounted(() => {
+	/* console.log(formProps.value.model[props.data.name])
+	console.log(formProps.value)
+	console.log(props.data.name) */
+	//nextTick(()=>{
+				if(formProps.value.model&&formProps.value.model.creater){
+					/* console.log(formProps.value.model[props.data.name])
+					console.log(formProps.value.model)
+					console.log(props.data.name) */
+					nextTick(()=>{
+						if(formProps.value.model[props.data.name]&&formProps.value.model[props.data.name] != ""&&parsedData.value.length==0){
+							parsedData.value = JSON.parse(formProps.value.model[props.data.name]);
+						}
+					})
+					value.value = parsedData.value
+				}else{
+					waitModelHasValue()
+				}
+			//})
+	/* setTimeout(()=>{
+		nextTick(()=>{
+				if(formProps.value.model[props.data.name]&&formProps.value.model[props.data.name] != ""&&parsedData.value.length==0){
+					parsedData.value = JSON.parse(formProps.value.model[props.data.name]);
+				}
+			})
+		checkedIdListChangedIndex(parsedData.value)
+	},500) */
+    
+	
+})
+
+/* watch(value, (newValue, oldValue) => {
+    
+},{deep:true}); */
 const updateModel = (val: any) => {
+	/* console.log("updateModel")
+	console.log(typeof(val))
+	console.log(val) */
 	let controlAttribute = ""
 	if(props.data.control){
 		if(props.data.control.type){
diff --git a/src/widget/lowcodetransfer/lowcodeTransfer.vue b/src/widget/lowcodetransfer/lowcodeTransfer.vue
index eed446e..2c57ec5 100644
--- a/src/widget/lowcodetransfer/lowcodeTransfer.vue
+++ b/src/widget/lowcodetransfer/lowcodeTransfer.vue
@@ -1,6 +1,6 @@
 <template>
-    <div  v-if="dataFinished" class="transfer">
-        <div class="leftArea">
+    <div  v-if="dataFinished" class="transfer"><!-- {{props.selectedValue}} -->
+        <div class="leftArea"><!-- {{ selectedValueCompu }}{{checkedIdList}} -->
             <div class="transferName">{{ transferConfig.transferName }}</div>
             <div style="padding-left: 15px; padding-right: 25px;margin-top: 10px;margin-bottom: 8px;">
                 <ElInput v-model="keyword" placeholder="搜索">
@@ -50,9 +50,21 @@ import request from '@/utils/request';
 const props = defineProps({
   // eslint-disable-next-line vue/require-default-prop
     data: {
-        type: Object,
-    }
+		type: Object,
+		default() {
+			return {};
+		},
+	},
+    selectedValue: {
+		type: Array,
+		default() {
+			return [];
+		},
+	},
 })
+
+
+const emits = defineEmits(['checkedIdListChanged','updateModel']);
 const fixedOptions = props.data?.control.fixedOptions
 const transferConfig = props.data?.config
 const treeProps = {
@@ -67,10 +79,69 @@ const isExpandAll = ref(false) // 是否全展开
 const keyword = ref('') // 搜索关键字
 const checkList = ref([]) // 选中的list
 const userList = ref([])
-let checkedIdList = ["302697","ceshi","301625"];
-checkedIdList = [];
+let checkedIdList = ref([]);
+let count = 0
+function waitAndReGet(){
+    /* console.log("waitAndReGet")
+    console.log(props.selectedValue)
+    console.log(props.selectedValue.value) */
+    setTimeout(()=>{
+        let values = props.selectedValue.map(item => {
+                // 假设这里需要提取每个元素的特定值，可以根据实际情况进行调整
+                return item;
+            });
+        if(props.selectedValue&&values){
+
+            /* console.log("有值")
+            console.log(props.selectedValue)
+            console.log(values) */
+			//return props.selectedValue.value
+            checkedIdList.value = values
+		}else{
+            if(count<3){
+                count++
+                waitAndReGet()
+            }
+            
+            /* console.log("waitAndReGet---else") */
+                
+        }
+    },2000)
+}
+
+const selectedValueCompu = computed({
+    get() {
+        //console.log("get")
+        //nextTick(()=>{
+            let values = props.selectedValue.map(item => {
+                // 假设这里需要提取每个元素的特定值，可以根据实际情况进行调整
+                return item;
+            });
+			if(props.selectedValue&&values){
+                /* console.log(props.selectedValue.value)
+                console.log("computed---if") */
+				return values
+			}else{
+                waitAndReGet()
+                /* console.log("computed---else") */
+                return []
+                
+            }
+            
+		//})
+        
+    },
+    set(){}
+})
+/* console.log(props.selectedValue) */
+
+
+
+
 const url = transferConfig.apiUrl;/* '/javasys/lowCode/transfer/getOrgAndManTree' */
 
+
+
 function getDetail() {
     //console.log(11111)
     if(transferConfig.transferDataSource==="数据源"){
@@ -90,9 +161,9 @@ if(transferConfig.transferDataSource==="数据源"){
             label: '全选',
             children: [...resData.value]
         }]
-        treeRef.value.setCheckedKeys(checkedIdList,true)
+        treeRef.value.setCheckedKeys(checkedIdList.value,true)
         setTimeout(() => {
-            checkedIdList.forEach(element => {
+            checkedIdList.value.forEach(element => {
             const _node = treeRef?.value?.getNode(element)
             if (!_node) return
             const _checkList = checkList.value
@@ -116,7 +187,7 @@ if(transferConfig.transferDataSource==="数据源"){
     });
 }
 const getCheckedList = () => {
-    checkedIdList = treeRef.value.getCheckedKeys(true)
+    checkedIdList.value = treeRef.value.getCheckedKeys(true)
 }
 
 
@@ -303,10 +374,10 @@ if(transferConfig.transferDataSource==="固定选项"){
             children: fixedOptions
         }]
         //console.log(treeRef)
-        
-        treeRef.value.setCheckedKeys(checkedIdList,true)
+        /* console.log(checkedIdList.value) */
+        treeRef.value.setCheckedKeys(checkedIdList.value,true)
         setTimeout(() => {
-            checkedIdList.forEach(element => {
+            checkedIdList.value.forEach(element => {
             const _node = treeRef?.value?.getNode(element)
             if (!_node) return
             const _checkList = checkList.value
@@ -334,9 +405,63 @@ if(transferConfig.transferDataSource==="固定选项"){
     
 
 onMounted(() => {
-
+    
 })
 
+
+
+// 监听 checkedIdList 的变化
+watch(checkedIdList, (newValue, oldValue) => {
+    //console.log('checkedIdList 发生了变化', newValue);
+    emits('checkedIdListChanged',newValue);
+},{deep:true});
+
+
+watch(selectedValueCompu, (newValue, oldValue) => {
+    //console.log('selectedValueCompu 发生了变化', newValue);
+    checkedIdList.value = selectedValueCompu.value
+    //获取配置接口相应或获取固定选项值
+if(transferConfig.transferDataSource==="固定选项"){
+    setTimeout(() => {
+        
+         // 全选方法2:插入 全选node
+        userList.value = [{
+            id: '全选',
+            label: '全选',
+            children: fixedOptions
+        }]
+        //console.log(treeRef)
+        /* console.log(checkedIdList.value) */
+        treeRef.value.setCheckedKeys(checkedIdList.value,true)
+        setTimeout(() => {
+            checkedIdList.value.forEach(element => {
+            const _node = treeRef?.value?.getNode(element)
+            if (!_node) return
+            const _checkList = checkList.value
+            if (_node.checked) { // 勾选时
+                if (_node.checked && _node.childNodes.length === 0) {   
+                    _checkList.push(_node)
+                }
+                // 通过new Set() 实现数据去重
+                checkList.value = Array.from(new Set(_checkList))
+                // 遍历子级,递归,直到获取最后一级的人员
+                if (_node.childNodes.length > 0) {
+                    _node.childNodes.map(item => handleCheckList(item.data))
+                }
+            } else if (!_node.checked) { // 取消勾选
+                checkList.value = checkList.value.filter(item => item.checked)
+            }   
+            });
+        }, 50);
+        }, 50);
+        dataFinished = true
+    }else{
+        getDetail
+        dataFinished = true
+    }
+    //emits('updateModel',newValue);
+},{deep:true});
+
 </script>