Merge branch 'lwx_v27'

src/components/DesignForm/assembly/index.ts

@@ -262,6 +262,10 @@ export default [
 				control: {
 					modelValue: '',
 					glxxsz: [],
+					zdtcsz: {
+						tbx: '',
+						tby: ''
+					},
 					optionsValue3Formid:'',
 					optionsValue3Field:'',
 				},
@@ -312,6 +316,10 @@ export default [
 					modelValue: '',
 					appendToBody: true,
 					glxxsz: [],
+					zdtcsz: {
+						tbx: '',
+						tby: ''
+					},
 					optionsValue3Formid:'',
 					optionsValue3Field:'',
 				},

src/components/DesignForm/formControlPropertiNew.vue

@@ -2910,22 +2910,552 @@ function mergeArrays(a, b) {
 
 //选项批量编辑  liwenxuan 20251212 end
 
+//自动填充设置 liwenxuan 20251230 start
+
+let datapropsformList = JSON.parse(JSON.stringify(props.formList))
+
+const zdtcszTree = computed(()=>{
+  if(datapropsformList&&datapropsformList.length==0){
+    datapropsformList = JSON.parse(JSON.stringify(props.formList))
+  }
+  
+  //console.log(datapropsformList)
+  if(associatedFormsCurrentFormFieldTreeForGlxxszExceptSelf && associatedFormsCurrentFormFieldTreeForGlxxszExceptSelf.value[0].children && associatedFormsCurrentFormFieldTreeForGlxxszExceptSelf.value[0].children.length>0){
+
+    
+    let datab = JSON.parse(JSON.stringify(associatedFormsCurrentFormFieldTreeForGlxxszExceptSelf.value[0].children))
+    let currentCompId = controlData.value.name
+    const treeC = mergeAndFilterFormTrees(datapropsformList, datab,currentCompId);
+    //console.log(treeC)
+    return treeC
+  }else{
+    return []
+  }
+  
+})
+// 使用 ref 替代 computed，使其可写
+const zdtcszTableData = ref([])
+
+// 获取当前正在设置自动填充的组件（"结果"组件）的选项
+const currentComponentOptions = computed(() => {
+
+    return controlData.value.options
+
+})
+
+// 获取当前选择的索引列节点（用于获取label）
+const currentIndexColumnNode = computed(() => {
+  if (!controlData.value?.control?.zdtcsz?.tby) return null
+  return zdtcszTree.value.find(item => item.id == controlData.value.control.zdtcsz.tby)
+})
+
+// 获取当前选择的标题行节点（用于获取label）
+const currentTitleColumnNode = computed(() => {
+  if (!controlData.value?.control?.zdtcsz?.tbx) return null
+  return zdtcszTree.value.find(item => item.id == controlData.value.control.zdtcsz.tbx)
+})
+
+// 索引列的标签
+const indexColumnLabel = computed(() => {
+  if (!currentIndexColumnNode.value) return "索引列"
+  return currentIndexColumnNode.value.label
+})
+
+// 标题行的标签
+const titleColumnLabel = computed(() => {
+  if (!currentTitleColumnNode.value) return "标题行"
+  return currentTitleColumnNode.value.label
+})
+
+// 左上角标签：格式为"索引列\标题行"
+const leftTopLabel = computed(() => {
+  return `${indexColumnLabel.value}\\${titleColumnLabel.value}`
+})
+
+// 原始选项数组（标题行=列，索引列=行）
+const titleOptions = computed(() => {
+  return currentTitleColumnNode.value?.options || []
+})
+
+const indexOptions = computed(() => {
+  return currentIndexColumnNode.value?.options || []
+})
+
+// 表格列配置
+const zdtcszTableColumns = computed(() => {
+  return titleOptions.value.map(item => ({
+    label: item.label,
+    value: item.value
+  }))
+})
+
+// 监听标题行和索引列的变化，重新生成表格数据
+watch([titleOptions, indexOptions], ([newTitleOptions, newIndexOptions]) => {
+  // 如果没有标题行或索引列，清空表格数据
+  if (!newTitleOptions.length || !newIndexOptions.length) {
+    zdtcszTableData.value = []
+    return
+  }
+
+  // 从 controlData 中获取之前保存的数据
+  const savedData = controlData.value?.control?.zdtcsz?.tableData || {}
+  
+  // 生成新的表格数据
+  const newTableData = newIndexOptions.map(rowItem => {
+    const rowKey = rowItem.value
+    const rowObj = {
+      rowKey: rowKey,
+      rowLabel: rowItem.label // 使用选项的label作为第一列显示
+    }
+    
+    // 为每个标题列生成值，如果有保存的数据则使用保存的数据
+    newTitleOptions.forEach(colItem => {
+      const colKey = colItem.value
+      const savedValue = savedData[rowKey]?.[colKey] || ''
+      rowObj[`col_${colKey}`] = savedValue
+    })
+    
+    return rowObj
+  })
+  
+  zdtcszTableData.value = newTableData
+}, { immediate: true })
+
+// 监听表格数据变化，保存到临时存储
+const handleTableDataChange = () => {
+  // 将表格数据转换为更容易存储的格式
+  const tableData = {}
+  zdtcszTableData.value.forEach(row => {
+    const rowKey = row.rowKey
+    tableData[rowKey] = {}
+    titleOptions.value.forEach(col => {
+      const colKey = col.value
+      tableData[rowKey][colKey] = row[`col_${colKey}`] || ''
+    })
+  })
+  
+  // 保存到 controlData 中
+  if (!controlData.value.control.zdtcsz) {
+    controlData.value.control.zdtcsz = {}
+  }
+  controlData.value.control.zdtcsz.tableData = tableData
+}
+
+// 确定按钮的处理函数
+const handleDetermineZdtcszDialogFlag = () => {
+  // 保存数据
+  handleTableDataChange()
+  
+  // 关闭弹窗
+  ZdtcszDialogFlag.value = false
+  
+  // 可以在这里添加其他处理逻辑
+  /* console.log('保存的数据:', controlData.value.control.zdtcsz.tableData)
+  console.log('当前组件选项:', currentComponentOptions.value)
+  console.log('左上角标签:', leftTopLabel.value) */
+}
+
+/**
+ * 合并两个组件树，仅保留type为radio和select的节点，并过滤掉指定compId的节点，同时保留options属性
+ * @param {Array} treeA - 组件树a，包含表单结构信息
+ * @param {Array} treeB - 组件树b，包含字段数据信息
+ * @param {String} compId - 需要过滤掉的组件id的后一部分
+ * @returns {Array} - 合并后仅包含radio和select节点的组件树c
+ */
+function mergeAndFilterFormTrees(treeA, treeB, compId) {
+  // 构建b树的映射，key为name（从id中提取），value为b树节点
+  const bMap = new Map();
+  
+  // 从b树中提取通用的parentId（假设所有节点有相同的parentId）
+  let commonParentId = null;
+  
+  // 从id中提取name：formField:30540:upload1765154030446 -> upload1765154030446
+  treeB.forEach(node => {
+    const id = node.id;
+    if (id) {
+      const parts = id.split(':');
+      const name = parts[parts.length - 1]; // 取最后一部分作为name
+      bMap.set(name, node);
+      
+      // 设置通用的parentId
+      if (node.parentId && !commonParentId) {
+        commonParentId = node.parentId;
+      }
+    }
+  });
+  
+  // 如果没有找到parentId，使用默认值
+  if (!commonParentId) {
+    commonParentId = "formField:30540";
+  }
+  
+  // 计数器
+  let gridCount = 0;
+  let tabsCount = 0;
+  let divCount = 0;
+  let cardCount = 0;
+  
+  // 递归处理a树，仅保留radio和select节点，并过滤掉compId
+  function processANode(node, parentId = commonParentId) {
+    // 获取当前节点的name
+    const nodeName = node.name;
+    const nodeType = node.type;
+    
+    // 检查当前节点是否需要被过滤（如果compId与节点name相等，则过滤）
+    if (compId && nodeName === compId) {
+      // 从bMap中删除对应的节点（如果存在），避免后面被使用
+      if (nodeName && bMap.has(nodeName)) {
+        bMap.delete(nodeName);
+      }
+      return null;
+    }
+    
+    // 如果是radio或select类型，直接处理
+    if (nodeType === 'radio' || nodeType === 'select') {
+      // 检查是否需要过滤
+      if (compId && nodeName === compId) {
+        return null;
+      }
+      
+      // 查找b树中对应的节点
+      let bNode = null;
+      if (nodeName && bMap.has(nodeName)) {
+        bNode = bMap.get(nodeName);
+        bMap.delete(nodeName); // 从map中删除，标记为已使用
+      }
+      
+      // 如果b节点存在，检查是否需要过滤
+      if (bNode && compId) {
+        const bNodeId = bNode.id || '';
+        const parts = bNodeId.split(':');
+        const bNodeName = parts[parts.length - 1];
+        if (bNodeName === compId) {
+          return null;
+        }
+      }
+      
+      let cNode;
+      if (bNode) {
+        // 复制b节点的所有属性
+        cNode = { ...bNode };
+        // 确保children数组存在
+        if (!cNode.children) {
+          cNode.children = [];
+        }
+        // 使用b节点的parentId
+        cNode.parentId = bNode.parentId || parentId;
+        
+        // 保留a节点中的options属性到c节点中
+        if (node.options && Array.isArray(node.options)) {
+          // 如果c节点中已经有options，可以合并，这里我们直接用a节点的options
+          // 因为a节点中的options通常是最新的配置
+          cNode.options = node.options;
+          
+          // 如果a节点有control.glxxsz（关联选项设置），也保留
+          if (node.control && node.control.glxxsz && Array.isArray(node.control.glxxsz)) {
+            if (!cNode.control) {
+              cNode.control = {};
+            }
+            cNode.control.glxxsz = node.control.glxxsz;
+          }
+        }
+      } else {
+        // 如果b中不存在，则创建新节点
+        const label = node.item?.label || nodeName || nodeType;
+        const id = nodeName ? `${commonParentId}:${nodeName}` : null;
+        cNode = {
+          id: id,
+          label: label,
+          parentId: parentId,
+          children: [],
+          value: id,
+          treeAttrs: {
+            show: label
+          },
+          disabled: false, // radio和select类型，叶子节点disabled为false
+          type: nodeType
+        };
+        
+        // 保留a节点中的options属性
+        if (node.options && Array.isArray(node.options)) {
+          cNode.options = node.options;
+        }
+        
+        // 保留control.glxxsz（关联选项设置）
+        if (node.control && node.control.glxxsz && Array.isArray(node.control.glxxsz)) {
+          if (!cNode.control) {
+            cNode.control = {};
+          }
+          cNode.control.glxxsz = node.control.glxxsz;
+        }
+        
+        // 保留config属性
+        if (node.config) {
+          cNode.config = node.config;
+        }
+      }
+      
+      return cNode;
+    }
+    
+    // 如果不是radio或select，但可能是容器类型，需要处理其子节点
+    // 检查是否是容器类型
+    const containerTypes = ['table', 'card', 'flex', 'div', 'grid', 'tabs'];
+    if (containerTypes.includes(nodeType)) {
+      // 检查容器节点本身是否需要过滤
+      if (compId && nodeName === compId) {
+        // 如果容器节点需要过滤，其所有子节点都不处理
+        // 从bMap中删除对应的节点（如果存在）
+        if (nodeName && bMap.has(nodeName)) {
+          bMap.delete(nodeName);
+        }
+        return null;
+      }
+      
+      // 创建一个容器节点占位符
+      let containerId;
+      let containerLabel;
+      let originalName = nodeName; // 保存原始name用于检查过滤
+      
+      // 根据容器类型设置不同的id和label
+      switch(nodeType) {
+        case 'grid':
+          gridCount++;
+          containerId = `格栅布局${gridCount}`;
+          containerLabel = containerId;
+          break;
+        case 'tabs':
+          tabsCount++;
+          containerId = `标签页${tabsCount}`;
+          containerLabel = containerId;
+          break;
+        case 'div':
+          divCount++;
+          containerId = `容器${divCount}`;
+          containerLabel = containerId;
+          break;
+        case 'card':
+          cardCount++;
+          containerId = `卡片${cardCount}`;
+          containerLabel = containerId;
+          break;
+        case 'table':
+        case 'flex':
+          // 对于table和flex，查找b树中对应的节点
+          let bNode = null;
+          if (nodeName && bMap.has(nodeName)) {
+            bNode = bMap.get(nodeName);
+            bMap.delete(nodeName);
+          }
+          
+          // 检查b节点是否需要过滤
+          if (bNode && compId) {
+            const bNodeId = bNode.id || '';
+            const parts = bNodeId.split(':');
+            const bNodeName = parts[parts.length - 1];
+            if (bNodeName === compId) {
+              return null;
+            }
+          }
+          
+          if (bNode) {
+            containerId = bNode.id || `${commonParentId}:${nodeName}`;
+            containerLabel = nodeType === 'table' ? `子表${bNode.label || nodeName}` : 
+                                            `弹性布局${bNode.label || nodeName}`;
+          } else {
+            containerId = `${commonParentId}:${nodeName}`;
+            containerLabel = nodeType === 'table' ? `子表${node.item?.label || nodeName}` : 
+                                            `弹性布局${node.item?.label || nodeName}`;
+          }
+          break;
+        default:
+          containerId = `${commonParentId}:${nodeName}`;
+          containerLabel = node.item?.label || nodeName || nodeType;
+      }
+      
+      // 创建容器节点
+      const containerNode = {
+        id: containerId,
+        label: containerLabel,
+        parentId: parentId,
+        children: [],
+        value: containerId,
+        treeAttrs: {
+          show: containerLabel
+        },
+        disabled: null, // 容器节点，非叶子节点
+        type: nodeType
+      };
+      
+      // 处理子组件
+      let hasValidChildren = false;
+      
+      if (nodeType === 'table' || nodeType === 'card' || nodeType === 'flex' || nodeType === 'div') {
+        // 这些类型的子组件在list中
+        if (node.list && Array.isArray(node.list)) {
+          const childNodes = [];
+          node.list.forEach(child => {
+            const processedChild = processANode(child, containerId);
+            if (processedChild) {
+              childNodes.push(processedChild);
+              hasValidChildren = true;
+            }
+          });
+          containerNode.children = childNodes;
+        }
+      } else if (nodeType === 'grid' || nodeType === 'tabs') {
+        // 这些类型的子组件在columns.list中
+        if (node.columns && Array.isArray(node.columns)) {
+          // 对于tabs，需要为每个column创建子节点
+          if (nodeType === 'tabs') {
+            const tabNodes = [];
+            node.columns.forEach((column, index) => {
+              // 为每个column创建一个节点
+              const columnId = `${containerId}:${column.label}`;
+              const columnNode = {
+                id: columnId,
+                label: column.label || `Tab${index + 1}`,
+                parentId: containerId,
+                children: [],
+                value: columnId,
+                treeAttrs: {
+                  show: column.label || `Tab${index + 1}`
+                },
+                disabled: null, // 非叶子节点
+                type: 'tab'
+              };
+              
+              // 处理column中的子组件
+              let columnHasValidChildren = false;
+              if (column.list && Array.isArray(column.list)) {
+                const childNodes = [];
+                column.list.forEach(child => {
+                  const processedChild = processANode(child, columnId);
+                  if (processedChild) {
+                    childNodes.push(processedChild);
+                    columnHasValidChildren = true;
+                    hasValidChildren = true;
+                  }
+                });
+                columnNode.children = childNodes;
+              }
+              
+              // 如果column有子节点，添加到tabs节点下
+              if (columnHasValidChildren) {
+                tabNodes.push(columnNode);
+              }
+            });
+            containerNode.children = tabNodes;
+          } else {
+            // 对于grid，直接处理所有columns中的子组件
+            const childNodes = [];
+            node.columns.forEach(column => {
+              if (column.list && Array.isArray(column.list)) {
+                column.list.forEach(child => {
+                  const processedChild = processANode(child, containerId);
+                  if (processedChild) {
+                    childNodes.push(processedChild);
+                    hasValidChildren = true;
+                  }
+                });
+              }
+            });
+            containerNode.children = childNodes;
+          }
+        }
+      }
+      
+      // 如果容器没有有效的子节点（radio或select），则返回null
+      if (!hasValidChildren) {
+        // 对于table和flex，即使没有子节点也要保留（因为可以选择）
+        if (nodeType === 'table' || nodeType === 'flex') {
+          containerNode.disabled = false;
+          return containerNode;
+        }
+        return null;
+      }
+      
+      // 设置容器节点的disabled属性
+      // 对于table和flex，即使有子节点也可以选择，disabled为false
+      if (nodeType === 'table' || nodeType === 'flex') {
+        containerNode.disabled = false;
+      } else {
+        // 其他容器类型，有子节点为null，没有子节点为true
+        containerNode.disabled = null;
+      }
+      
+      return containerNode;
+    }
+    
+    // 其他非radio/select类型，直接返回null
+    return null;
+  }
+  
+  // 处理a树的所有根节点
+  const cTree = [];
+  treeA.forEach(rootNode => {
+    const processedNode = processANode(rootNode);
+    if (processedNode) {
+      cTree.push(processedNode);
+    }
+  });
+  
+  // 将b树中剩余的radio和select元素（在a中不存在的）添加到c树中
+  bMap.forEach((bNode, nodeName) => {
+    // 检查是否需要过滤
+    if (compId) {
+      const bNodeId = bNode.id || '';
+      const parts = bNodeId.split(':');
+      const bNodeName = parts[parts.length - 1];
+      if (bNodeName === compId) {
+        // 过滤掉这个节点
+        return;
+      }
+    }
+    
+    // 只保留radio和select类型
+    if (bNode.type === 'radio' || bNode.type === 'select') {
+      // 保留b节点的原始结构
+      const newNode = { ...bNode };
+      
+      // 确保children数组存在
+      if (!newNode.children) {
+        newNode.children = [];
+      }
+      
+      // 设置disabled属性为false（叶子节点）
+      newNode.disabled = false;
+      
+      cTree.push(newNode);
+    }
+  });
+  
+  return cTree;
+}
+
+// 使用示例
+// const filteredTree = mergeAndFilterFormTrees(treeA, treeB, 'radio1763601215033');
+
+
+//自动填充设置 liwenxuan 20251230 end
+
 
 
 //关联选项设置优化为树 liwenxuan 20251209 start
-let datapropsformList = JSON.parse(JSON.stringify(props.formList))
+
 const glxxszTree = computed(()=>{
   if(datapropsformList.length==0){
     datapropsformList = JSON.parse(JSON.stringify(props.formList))
   }
   
-  //console.log(datapropsformList)
+  console.log(datapropsformList)
   if(associatedFormsCurrentFormFieldTreeForGlxxszExceptSelf && associatedFormsCurrentFormFieldTreeForGlxxszExceptSelf.value[0].children && associatedFormsCurrentFormFieldTreeForGlxxszExceptSelf.value[0].children.length>0){
 
     
     let datab = JSON.parse(JSON.stringify(associatedFormsCurrentFormFieldTreeForGlxxszExceptSelf.value[0].children))
     
     const treeC = mergeFormTrees(datapropsformList, datab);
+    console.log(treeC)
     return treeC
   }else{
     return null
@@ -4014,6 +4544,7 @@ function handleDetermineAssociatedFormsChooseDialog() {
 
 //liwenxuan20240426 单选多选下拉 关联选项设置  start
 
+const ZdtcszDialogFlag = ref(false);
 const glxxszDialogFlag = ref(false);
 const glxxszDialogFlagCheckBox = ref(false);
 const glxxszDialogFlagSwitch = ref(false);
@@ -4035,6 +4566,24 @@ function handelGlxxszDialog() {
   }
 }
 
+function handelZdtcszDialog(){
+  if (controlData.value.options.length === 0) {
+    alert("无可配置选项，请先添加。");
+  } else {
+
+    if(controlData.value.control.zdtcsz){
+
+    }else{
+      controlData.value.control.zdtcsz = {
+						tbx: '',
+						tby: ''
+					}
+    }
+    ZdtcszDialogFlag.value = true;
+    
+  }
+}
+
 function handelGlxxszDialogCheckbox() {
   glxxszDialogFlagCheckBox.value = true;
 }
@@ -6228,26 +6777,39 @@ const formatTooltip = (val: number) => {
                   </template>
                 </draggable>
               </div>
+              <!-- 
+                
+              -->
               <!-- 多选选择框选项拖动功能 liwenxuan 20240815 end -->
               <el-form-item class="form_cont">
                 <el-button @click="addSelectOption">{{
                   controlData.type === "cascader" ? "编辑" : "新增"
                 }}</el-button>
-                <el-button  size="small" @click="openDialog" style="margin-right: 12px;">
+                <el-button  size="small" style="margin-right: 12px;" @click="openDialog">
                   批量导入
                 </el-button>
-                <div v-if="showHide(['switch'], true)">
-                  <el-button style="position: relative; top: -1px" @click="handelGlxxszDialogSwitch" >关联选项设置</el-button>
-                </div>
-                <div
-                  v-if="
-                    showHide(['radio', 'select'], true) && controlData.config.optionsType == 0
-                  "
-                >
-                  <el-button  style="position: relative; top: -1px" @click="handelGlxxszDialog">关联选项设置</el-button>
-                </div>
-                <div v-if="showHide(['checkbox'], true) && controlData.config.optionsType == 0">
-                  <el-button  style="position: relative; top: -1px" @click="handelGlxxszDialogCheckbox">关联选项设置</el-button>
+                <div style="width:100%; position: relative;  top: 6px; display: flex;">
+                  <div v-if="showHide(['switch'], true)">
+                    <el-button style="position: relative; top: -1px" @click="handelGlxxszDialogSwitch" >关联选项设置</el-button>
+                  </div>
+                  <div
+                    v-if="
+                      showHide(['radio', 'select'], true) && controlData.config.optionsType == 0
+                    "
+                  >
+                    <el-button  style="position: relative; top: -1px" @click="handelGlxxszDialog">关联选项设置</el-button>
+                  </div>
+                  <div v-if="showHide(['checkbox'], true) && controlData.config.optionsType == 0">
+                    <el-button  style="position: relative; top: -1px" @click="handelGlxxszDialogCheckbox">关联选项设置</el-button>
+                  </div>
+
+                  <div
+                    v-if="
+                      showHide(['radio', 'select'], true) && controlData.config.optionsType == 0
+                    "
+                  >
+                    <el-button  style="position: relative; top: -1px;right:-12px" @click="handelZdtcszDialog">矩阵填充设置</el-button>
+                  </div>
                 </div>
               </el-form-item>
               
@@ -7972,9 +8534,115 @@ const formatTooltip = (val: number) => {
 
 
 
+  <!-- 自动填充设置弹窗 start -->
+
+  <el-dialog
+  v-model="ZdtcszDialogFlag"
+  class="glxxsztc"
+  top="150px"
+  :close-on-click-modal="false"
+  :title="`矩阵填充设置--` + controlData.name"
+  :show-close="false"
+  style="margin-top: 70px"
+  width="50%"
+>
+  <!-- 外层容器保持flex布局，核心是给文本span加固定最小宽度+禁止换行 -->
+  <div v-if="ZdtcszDialogFlag" style="width: 100%; display: flex; align-items: center; flex-wrap: nowrap; gap: 10px; padding: 8px 0;">
+    <!-- 标题行文本 -->
+    <span style="font-size: larger; margin-left: 35px; min-width: 60px; white-space: nowrap;">标题行</span>
+    
+    <!-- 第一个树形选择器 -->
+    <el-tree-select
+      v-model="controlData.control.zdtcsz.tbx"
+      :data="zdtcszTree"
+      collapse-tags 
+      collapse-tags-tooltip 
+      :max-collapse-tags="2" 
+      clearable
+      filterable
+      style="flex: 1; min-width: 200px; max-width: 400px;"
+    />
+
+    <!-- 索引列文本 -->
+    <span style="font-size: larger; min-width: 60px; white-space: nowrap;">索引列</span>
+    
+    <!-- 第二个树形选择器 -->
+    <el-tree-select
+      v-model="controlData.control.zdtcsz.tby"
+      :data="zdtcszTree"
+      collapse-tags 
+      collapse-tags-tooltip 
+      :max-collapse-tags="2" 
+      clearable
+      filterable
+      style="flex: 1; min-width: 200px; max-width: 400px; margin-right: 35px;"
+    />
+  </div>
+
+  <div style="width: 100%; padding: 20px; overflow-x: auto;">
+    <el-table
+      :data="zdtcszTableData"
+      border
+      style="width: 100%;"
+      :header-cell-style="{ textAlign: 'center' }"
+      :cell-style="{ textAlign: 'center' }"
+    >
+      <!-- 第一列：动态列标题，显示"索引列\标题行"的格式 -->
+      <el-table-column
+        :label="leftTopLabel"
+        prop="rowLabel"
+        width="200"
+        align="center"
+      />
+      <!-- 动态生成标题行对应的表格列 -->
+      <el-table-column
+        v-for="col in zdtcszTableColumns"
+        :key="col.value"
+        :label="col.label"
+        :prop="`col_${col.value}`"
+        min-width="200"
+        align="center"
+      >
+        <template #default="scope">
+          <!-- 改为下拉选择器 -->
+          <el-select
+            v-model="scope.row[`col_${col.value}`]"
+            size="small"
+            placeholder="请选择"
+            style="width: 100%;"
+            @change="handleTableDataChange"
+          >
+            <el-option
+              v-for="option in currentComponentOptions"
+              :key="option.value"
+              :label="option.label"
+              :value="option.value"
+            />
+          </el-select>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
+    
+  <template #footer>
+    <div class="dialog-footer">
+      <el-button type="primary" @click="handleDetermineZdtcszDialogFlag">
+        确定
+      </el-button>
+    </div>
+  </template>
+</el-dialog>
+
+<!-- 自动填充设置弹窗 end -->
+
+<!-- 
+
+-->
+
 <!-- 用户组织联动选择  start-->
 
-<!--  -->
+
+
 <el-dialog
     v-model="selectOrgConnectUserDialogFlag"
     title="选择关联的用户组件"