Merge remote-tracking branch 'zkqyOrigin/master'

zkqy-ui/src/api/formCreateMange/mobilePageNavigationBar.js

@@ -55,3 +55,23 @@ export function delMobilePageNavigationBar(id) {
     baseURL: process.env.VUE_APP_BASE_API3
   })
 }
+
+// 获取所有的下拉接口的路径
+export function getAllJavaInterfacePath() {
+  return request({
+    url: '/system/mobilePageDesignDataJavaInterface/list/all',
+    method: 'get',
+    baseURL: process.env.VUE_APP_BASE_API3
+  })
+}
+
+// 某一接口获取字段和list的接口。
+export function getJavaInterfaceController(url) {
+  return request({
+    url: url,
+    method: 'get',
+    baseURL: process.env.VUE_APP_BASE_API3
+  })
+}
+
+

zkqy-ui/src/views/dragform/index.vue

@@ -238,7 +238,7 @@
         <template slot-scope="scope">
           <el-dropdown>
             <el-button type="warning" plain size="small">
-              {{ $t('dragform.handle') }}<i class="el-icon-arrow-down el-icon--right"></i>
+              {{ $t('tableList.handle') }}<i class="el-icon-arrow-down el-icon--right"></i>
             </el-button>
             <el-dropdown-menu slot="dropdown">
               <el-dropdown-item

zkqy-ui/src/views/dragform/tableList.vue

@@ -110,7 +110,7 @@
       <el-table-column :label="$t('tableList.tableDescription')" align="center" prop="dtNotes" />
       <el-table-column :label="$t('tableList.timeFormat')" align="center" prop="timeFormat" />
       <el-table-column
-        :label="$t('tableList.operation')"
+        :label="$t('tableMange.operation')"
         align="center"
         class-name="small-padding fixed-width"
       >

zkqy-ui/src/views/formCreate/layout/home/formCreateMange.vue

@@ -185,7 +185,7 @@ import tableRule from "../../config/rule/zkqyMenuJs/zkqyMenuJs.js";
 import { mapGetters, mapState, mapActions } from "vuex";
 import zkqyTableTemplate from './templateJs/zkqyTable.js';
 
-import { listAllMobilePageDesignData } from "@/api/formCreateMange/mobilePageNavigationBar.js";
+import { listAllMobilePageDesignData, getAllJavaInterfacePath, getJavaInterfaceController } from "@/api/formCreateMange/mobilePageNavigationBar.js";
 
 import {
   listMobilePageDesignData,
@@ -218,6 +218,8 @@ export default {
       }
     }
     return {
+      // item可选的接口
+      ItemDataSource:[],
       mainTableHC:[],
       // 组件参数----start
       optionDataComponentType: {},
@@ -259,7 +261,7 @@ export default {
         ...(hashData?.config || {}),
         fieldReadonly: false,  //配置field是否可以编辑,字段id，zh-cn.js的
         showSaveBtn: true,
-        appendConfigData: ['formCreateItemDataSource','formCreateCardTable','formCreateCardColumn','formCreateCardSelect','formCreateCardSelectType','formCreateCardCycle','formCreateCardCallableInterface','formCreateCardButtonTable','formCreateCardButtonTZYM','formCreateCardButtonANSJ','formCreateCardButtonColumn','formCreateColumnItem','formCreateTableName', 'formCreateZkqyYMLX', 'formCreateZkqyAN', 'formCreateShowValue', 'addZkqyTableRow', 'updateZkqyTableRow'],
+        appendConfigData: ['formCreateCardColumnTZJS','formCreateCardColumnTZ','formCreateItemDataSource','formCreateItemAssociatedField','formCreateItemAssociatedFieldTZJS','formCreateItemAssociatedFieldTZ','formCreateCardTable','formCreateCardColumn','formCreateCardSelect','formCreateCardSelectType','formCreateCardCycle','formCreateCardCallableInterface','formCreateCardButtonTable','formCreateCardButtonTZYM','formCreateCardButtonANSJ','formCreateCardButtonColumn','formCreateColumnItem','formCreateColumnItemTZPT', 'formCreateTableName', 'formCreateZkqyYMLX', 'formCreateZkqyAN', 'formCreateShowValue', 'addZkqyTableRow', 'updateZkqyTableRow'],
         showControl: false, // 隐藏组件的联动数据配置
         formRule: {
           prepend: true,
@@ -425,7 +427,7 @@ export default {
                 field: 'formCreateCardSelectType',
                 title: '搜索类型',
                 value: '',
-                options: [{label:'输入框',value:'input'},{label:'下拉框',value:'select'}]
+                options: [{label:'输入框',value:'input'},{label:'下拉框',value:'select'},{label:'时间段',value:'dateRange'}]
               },
               {
                 type: 'switch',
@@ -440,14 +442,36 @@ export default {
               {
                 type: 'select',
                 field: 'formCreateCardCallableInterface',
-                title: ' 可调用接口',
+                title: ' 可调用接口(NEW)',
                 value: '',
-                options: that.cardCallableInterface
+                // options: that.cardCallableInterface
+                options: that.ItemDataSource
               },
+                {
+                type: 'select',
+                field: 'formCreateItemDataSource',
+                title: '数据来源(NEW)',
+                value: '',
+                options: that.ItemDataSource
+                },
+              {
+                type: 'select',
+                field: 'formCreateItemAssociatedField',
+                title: '搜索字段(NEW)',
+                value: '',
+                options: []
+              },
+            {
+              type: 'select',
+              field: 'formCreateItemAssociatedFieldTZJS',
+              title: '接收字段(NEW)',
+              value: '',
+              options: []
+            },
               {
                 type: 'button',
                 field: 'zkqyOptionCardData',
-                title: '多张卡片配置',
+                title: '多张卡片配置(PT)',
                 value: '',
                 props: {
                   type: 'primary',
@@ -463,14 +487,28 @@ export default {
               {
                 type: 'select',
                 field: 'formCreateCardTable',
-                title: '可选表',
+                title: '可选表(PT)',
                 value: '',
                 options: cardTable
               },
               {
                 type: 'select',
                 field: 'formCreateCardColumn',
-                title: '可选列',
+                title: '可选列(PT)',
+                value: '',
+                options: cardColumn
+              },
+              {
+                type: 'select',
+                field: 'formCreateCardColumnTZ',
+                title: '跳转列(PT)',
+                value: '',
+                options: cardColumn
+              },
+              {
+                type: 'select',
+                field: 'formCreateCardColumnTZJS',
+                title: '接收列(PT)',
                 value: '',
                 options: cardColumn
               },
@@ -482,14 +520,14 @@ export default {
               {
                 type: 'select',
                 field: 'formCreateCardButtonTable',
-                title: '可选表',
+                title: '可选表(PT)',
                 value: '',
                 options: cardTable
               },
               {
                 type: 'select',
                 field: 'formCreateCardButtonColumn',
-                title: '可选列',
+                title: '可选列(PT)',
                 value: '',
                 options: cardColumn
               },
@@ -505,7 +543,7 @@ export default {
                 field: 'formCreateCardButtonANSJ',
                 title: '按钮事件',
                 value: '',
-                options: [{label:'跳转卡片页',value:'cards'},{label:'跳转详情页',value:'form'}]
+                options: [{label:'跳转页面',value:'cards'},{label:'其他',value:'form'}]
               },
             ],
             true,
@@ -524,16 +562,61 @@ export default {
     elCardBoundfieldSelect: {
         handler(newVal, oldVal) {
         console.log('elCardBoundfieldSelect变化发生了变化:-------1------------');
+        let  that = this
+        let res;
+        listAllMobilePageDesignData().then(response => {
+        res = response.rows.map(item => {
+          return {
+            ...item,
+            label: item.name,
+            value: item.id,
+          }
+        });})
         // 找到所有包含 formCreateColumnItem 的配置并更新
-        this.$refs.designer.setComponentRuleConfig(['input','textarea','rate','timePicker','timeRange','dateRange','datePicker','slider','upload','elImage'],  // id
+        this.$refs.designer.setComponentRuleConfig(['input','textarea','rate','timePicker','timeRange','dateRange','datePicker','slider','upload','elImage','elButton'],  // id
           () => [  
+          {
+                type: 'select',
+                field: 'formCreateCardButtonTZYM',
+                title: '跳转页面',
+                value: '',
+                options: res
+              },
             {
               type: 'select',
               field: 'formCreateColumnItem',
-              title: '绑定字段',
+              title: '绑定字段(PT)',
+              value: '',
+              options: newVal
+            },
+            {
+              type: 'select',
+              field: 'formCreateColumnItemTZPT',
+              title: '跳转字段(PT)',
               value: '',
               options: newVal
             },
+            {
+              type: 'select',
+              field: 'formCreateItemDataSource',
+              title: '数据来源(NEW)',
+              value: '',
+              options: that.ItemDataSource
+            },
+            {
+              type: 'select',
+              field: 'formCreateItemAssociatedField',
+              title: '关联字段(NEW)',
+              value: '',
+              options: []
+            },
+            {
+              type: 'select',
+              field: 'formCreateItemAssociatedFieldTZ',
+              title: '跳转列(NEW)',
+              value: '',
+              options: []
+            },
           ],
           true,
         )
@@ -901,16 +984,25 @@ export default {
 
           let columns = this.optionCardDataPz
           // 找到type为elCard的对象并添加columns属性
-          pageJson  =pageJson.map(rule => {
+          pageJson = pageJson.map(rule => {
             if(rule.type === 'elCard') {
-              return {
-                ...rule,
-                columns: this.optionCardDataPz
+              if(rule.props) {
+                return {
+                  ...rule,
+                  columns: this.optionCardDataPz
+                }
+              } else {
+                return {
+                  ...rule,
+                  props: {},
+                  columns: this.optionCardDataPz
+                }
               }
             }
             return rule;
           });
           console.log('pageJson',pageJson)
+          // this.$refs.designer.setRule(pageJson)
           let { htmlDataMb } = this.$refs.designer.getSaveDate(true,JSON.stringify(columns),dataSource,url)
           htmlDataMbZkqyData = htmlDataMb
           htmlData = htmlDataMbZkqyData
@@ -1076,7 +1168,7 @@ export default {
                 field: 'formCreateCardSelectType',
                 title: '搜索类型',
                 value: '',
-                options: [{label:'输入框',value:'input'},{label:'下拉框',value:'select'}]
+                options: [{label:'输入框',value:'input'},{label:'下拉框',value:'select'},{label:'时间段',value:'dateRange'}]
               },
               {
                 type: 'switch',
@@ -1091,10 +1183,32 @@ export default {
               {
                 type: 'select',
                 field: 'formCreateCardCallableInterface',
-                title: '可调用接口',
+                title: '可调用接口(NEW)',
                 value: '',
-                options: that.cardCallableInterface
+                options: that.ItemDataSource
               },
+              {
+              type: 'select',
+              field: 'formCreateItemDataSource',
+              title: '数据来源(NEW)',
+              value: '',
+              options: that.ItemDataSource
+            },
+            {
+              type: 'select',
+              field: 'formCreateItemAssociatedField',
+              title: '搜索字段(NEW)',
+              value: '',
+              options: []
+            },
+            
+            {
+              type: 'select',
+              field: 'formCreateItemAssociatedFieldTZJS',
+              title: '接收字段(NEW)',
+              value: '',
+              options: []
+            },
             {
               type: 'button',
               field: 'zkqyOptionCardData',
@@ -1115,14 +1229,16 @@ export default {
           false
         )
       this.$refs.designer.addComponent(tableRule);
+      let res;
       listAllMobilePageDesignData().then(response => {
-        let res = response.rows.map(item => {
+        res = response.rows.map(item => {
           return {
             ...item,
             label: item.name,
             value: item.id,
           }
         });
+       
         // 关联数据表
         let data = {
           databaseName: this.databaseName,
@@ -1218,26 +1334,40 @@ export default {
               value: '',
               options: []
             },
-            // {
-            //   type: 'select',
-            //   field: 'formCreateColumnItem',
-            //   title: '绑定字段',
-            //   value: '',
-            //   options:[]
-            // },
           ],
           true,
         )
       }); 
-      this.$refs.designer.setComponentRuleConfig(['input','textarea','rate','timePicker','timeRange','dateRange','datePicker','slider','upload','elImage'],  // id
+      this.$refs.designer.setComponentRuleConfig(['input','textarea','rate','timePicker','timeRange','dateRange','datePicker','slider','upload','elImage','elButton'],  // id
           () => [  
+          {
+                type: 'select',
+                field: 'formCreateCardButtonTZYM',
+                title: '跳转页面',
+                value: '',
+                options: res
+              },
             {
               type: 'select',
               field: 'formCreateItemDataSource',
-              title: '数据来源',
+              title: '数据来源(NEW)',
+              value: '',
+              options: this.ItemDataSource
+            },
+            {
+              type: 'select',
+              field: 'formCreateItemAssociatedField',
+              title: '关联字段(NEW)',
               value: '',
               options: []
             },
+            {
+                type: 'select',
+                field: 'formCreateItemAssociatedFieldTZ',
+                title: '跳转列(NEW)',
+                value: '',
+                options: []
+              },
           ],
           true,
         )   
@@ -1297,14 +1427,14 @@ export default {
           this.elCardBoundfieldSelect = []
       }
     },
-    active(e, gLSJB) {
+    active(e, gLSJB,cardFlag) {
       let rule = this.$refs.designer.getRule()
       console.log('e---------',e,gLSJB)
       console.log('active时的rule',rule)
       // 查找type为elCard的规则
       const elCardRule = rule.find(item => item.type === "elCard")
       let url = process.env.VUE_APP_BASE_API3
-      if (gLSJB) {
+      if (gLSJB && !cardFlag) {
         let data = {
           databaseName: this.databaseName,
           databaseType: this.databaseType,
@@ -1323,6 +1453,40 @@ export default {
             this.$set(formCreateShowValue, 'options', x);
           }
         })
+      }else if(!gLSJB && cardFlag){
+        console.log('cardFlag',e)
+        let colums = []
+        // 这里要调接口给关联字段值,e是调接口的url
+        getJavaInterfaceController(e).then(response=>{
+          console.log('获取字段和list的接口',response?.data?.column)
+          if(response?.code == 200){
+            colums =  response?.data?.columns
+            colums = colums.map(item=>{
+              return {
+                ...item,
+                label:item.value,
+                value:item.key
+              }
+            })
+            let formCreateItemAssociatedField = this.$refs.designer.propsForm?.rule.find(item => item.field === "formCreateItemAssociatedField")
+            let formCreateItemAssociatedFieldTZ = this.$refs.designer.propsForm?.rule.find(item => item.field === "formCreateItemAssociatedFieldTZ")
+            let formCreateItemAssociatedFieldTZJS = this.$refs.designer.propsForm?.rule.find(item => item.field === "formCreateItemAssociatedFieldTZJS")
+            if (formCreateItemAssociatedField) {
+                this.$set(formCreateItemAssociatedField, 'options', colums);
+              }
+              if (formCreateItemAssociatedFieldTZ) {
+                this.$set(formCreateItemAssociatedFieldTZ, 'options', colums);
+              }
+              if (formCreateItemAssociatedFieldTZJS) {
+                this.$set(formCreateItemAssociatedFieldTZJS, 'options', colums);
+              }
+              }else{
+                colums = []
+                this.$set(formCreateItemAssociatedField, 'options', colums);
+                this.$set(formCreateItemAssociatedFieldTZ, 'options', colums);
+                this.$set(formCreateItemAssociatedFieldTZJS, 'options', colums);
+              }
+            })
       }
       if(e.type==="upload"){
         let rules = this.$refs.designer.getRule();
@@ -1340,6 +1504,7 @@ export default {
         });
         this.$refs.designer.setRule(updatedRules);
       }
+      // 后面来看这里要不要注释
       if(elCardRule) {
         let elCardBoundfieldSelect = this.elCardBoundfieldSelect
         let formCreateColumnItem = this.$refs.designer.propsForm?.rule.filter(item => item.field === "formCreateColumnItem")
@@ -1349,11 +1514,15 @@ export default {
       }
     },
     activeRuleChange({ newVal }) {
-      console.log(' newVal', newVal?.tableName)
+      console.log(' newVal?.tableName--选择关联表时', newVal?.tableName)
+      console.log(' newVal--下拉框变动时', newVal?.itemDataSource)
       if (newVal?.tableName) {
-        this.active(newVal.tableName, true)
+        this.active(newVal.tableName, true, false)
+      }else if (newVal?.itemDataSource) {
+        this.active(newVal.itemDataSource, false,true)
       }
     },
+    
     // 打开弹窗时加载主表数据
     async openDialog() {
       this.formState = true;
@@ -1739,9 +1908,27 @@ export default {
       this.optionCardDataPz = columns;
       this.optionCardDataDisplay = false;
     },
+    getAllJavaInterfacePath(){
+       //  这里调接口给ItemDataSource赋值
+      getAllJavaInterfacePath().then(response=>{
+        console.log('获取所有的下拉接口的路径',response)
+        if (response.code == 200) {
+          this.ItemDataSource = response.rows.map(item=>{
+              return {
+                ...item,
+                label:item.info,
+                value:item.path
+              }
+          })
+        }else{
+          this.ItemDataSource = []
+        }
+      })
+    },
+       
   },
   created() {
-    // this.addDatabaseTableField();
+    this.getAllJavaInterfacePath()
   },
   beforeDestroy() {
     const id = this.autoSaveId;

zkqy-ui/src/views/formCreate/utils/index.js

@@ -585,17 +585,69 @@ export function htmlTemplateCard(json, options,zkqyData,dataSource,url) {
     if(cardComponent) {
       x = !cardComponent.cardSelect;
     }
-    console.log('json', jsonData);
+    console.log('htmlTemplateCardm模板传入的jsonData', jsonData);
     console.log('json---x', x);
+    // cardComponent?.columns
+    // cardComponent?.cardCallableInterface
     
-    // 根据 x 的值生成不同的模板
-    const searchInputTemplate = x ? `
-            <div>
-                <el-input placeholder="请输入内容" v-model="selectValue" class="input-with-select">
+    // 根据 cardSelectType 的值生成不同的模板
+    let searchInputTemplate = '';
+    let cardCallableInterface = '';
+    let cardCycle = false;
+    let oldFlag = false;
+    let selectRc = '';
+    let cardColumnTZJS = '';
+    // cardButtonTZYM 
+    if (x) {
+        if (cardComponent?.cardSelectType == 'input') {
+            searchInputTemplate = `
+                <div style="display: flex; align-items: center;">
+                    <el-input placeholder="请输入内容" v-model="selectValue" class="input-with-select" clearable>
+                        <el-button slot="append" icon="el-icon-search" @click="searchCardList()"></el-button>
+                    </el-input>
+                </div>`;
+        } else if (cardComponent?.cardSelectType == 'select') {
+            searchInputTemplate = `
+                <div>
+                    <el-select v-model="selectValue" placeholder="请选择"  style="width: 100%" clearable>
+                        <el-option
+                            v-for="item in selectOptions"
+                            :key="item.value"
+                            :label="item.label"
+                            :value="item.value">
+                        </el-option>
+                    </el-select>
                     <el-button slot="append" icon="el-icon-search" @click="searchCardList()"></el-button>
-                </el-input>
-            </div>` : '';
+                </div>`;
+        } else if (cardComponent?.cardSelectType == 'dateRange') {
+            searchInputTemplate = `
+                <div style="display: flex; align-items: center;">
+                    <el-date-picker
+                        v-model="selectValue"
+                        type="daterange"
+                        range-separator="至"
+                        start-placeholder="开始日期"
+                        end-placeholder="结束日期"
+                        value-format="yyyy-MM-dd"
+                        style="width: 100%">
+                    </el-date-picker>
+                    <el-button slot="append" icon="el-icon-search" @click="searchCardList()"></el-button>
+                </div>`;
+        }
+    }
+    if(cardComponent?.columns ||  !cardComponent?.cardCallableInterface){
+        oldFlag = true
+        cardColumnTZJS = cardComponent?.cardColumnTZJS;
+    }else if(cardComponent?.cardCallableInterface){
+        oldFlag = false
+        //  如果cardCycle是true,是自己选1个接口--单张--不循环
+        //  如果是false，是自己选1个接口--多张--循环
+        cardCallableInterface = cardComponent?.cardCallableInterface?.replace(/^\//, '') || ''
+        cardCycle = cardComponent?.cardCycle
+        selectRc = cardComponent?.itemAssociatedField
+        cardColumnTZJS = cardComponent?.itemAssociatedFieldTZJS;
 
+    }
     return `<html lang="zh">
     <head>
         <meta charset="UTF-8">
@@ -638,41 +690,208 @@ export function htmlTemplateCard(json, options,zkqyData,dataSource,url) {
                             pageSize: 5,
                             pageNum: 1
                         },
+                        originalRule: null,
                         selectValue:'',
+                        cardCallableInterface:'${cardCallableInterface}',
+                        cardCycle:${cardCycle},
+                        oldFlag: ${oldFlag},
+                        selectRc:'${selectRc}',
+                        cardColumnTZJS:'${cardColumnTZJS}',
+                        savedTZJSValue:'',
+                        selectOptions: [
+                            { value: '1', label: '已完成' },
+                            { value: '2', label: '未完成' },
+                        ],
                         zkqyData:${zkqyData},
                         
                     };
                 },
                 mounted(){
-                        // 寻找type为'elCard'的对象
+                // 保存原始规则
+                        this.originalRule = JSON.parse(JSON.stringify(this.rule));
                         const cardComponent = Array.isArray(this.rule) ? 
-                            this.rule.find(item => item.type === 'elCard') : null;
+                        this.rule.find(item => item.type === 'elCard') : null;
                         // 获取pageId
                         const x = cardComponent?.props?.pageId;
                         // 设置到cardList中
                         this.cardList.pageId = x;
                         // 获取分页参数
                         let { pageId, pageNum, pageSize} = this.cardList;
+                    if(this.oldFlag){
                         // 调用接口
                         this.getTableLimitInfo({pageId, pageNum, pageSize});
+                   }else{
+                        console.log('是否循环',this.cardCycle)
+                        console.log('自选的一个接口',this.cardCallableInterface)
+                        if(this.cardCycle){
+                            this.getCardCycleNew({pageId, pageNum, pageSize})
+                        }else{
+                           this.getCardCycleNew({pageId, pageNum, pageSize})
+                        }
+                   }
                 },
                 methods: { 
-                    searchCardList(){
-                        this.rule.forEach(item => {
-                            if(item.type === 'elCard'){
-                                let cardColumn = item.cardColumn;
-                                let { pageId, pageNum, pageSize} = this.cardList;
-                                // 添加搜索参数
-                                let params = {
-                                        pageId, 
-                                        pageNum,
-                                        pageSize,
-                                        [cardColumn]: this.selectValue
-                                    }; 
-                                // 调用接口
-                                this.getTableLimitInfo(params);
-                            }
-                        })
+                   async getCardCycleNew(params = {}) {
+                            const endpoint = this.cardCallableInterface;
+                            await this.fetchGet(endpoint, params, (data) => {
+                                if (data.code === 200) {
+                                    console.log('Data', data);
+                                    // 获取第一个 elCard 类型的组件作为模板
+                                    const templateCard = Array.isArray(this.rule) ? 
+                                        this.rule.find(item => item.type === 'elCard') : null;
+                                    if (templateCard) {
+                                        console.log('templateCard',templateCard)
+                                        console.log('data.columns',data.data)
+                                        console.log('data.columns',data.data.columns)
+                                        console.log('data.result',data.data.result)
+                                        // 将 columns 转换为键值对映射
+                                        const columnMap = data.data.columns.reduce((acc, col) => {
+                                            acc[col.key] = col.value;
+                                            return acc;
+                                        }, {});
+
+                                        // 处理结果数据
+                                        const formattedResult = data.data.result.map(item => {
+                                            const formattedItem = {};
+                                            // 遍历 columns 中定义的键
+                                            data.data.columns.forEach(col => {
+                                                formattedItem[col.key] = item[col.key];
+                                            });
+                                            return formattedItem;
+                                        });
+
+                                        console.log('格式化后的结果:', formattedResult);
+
+                                        // 创建新的数组，根据 data.rows 的数量复制 elCard
+                                        const newRule = formattedResult.map((row, index) => {
+                                            // 深拷贝模板对象
+                                            const newCard = JSON.parse(JSON.stringify(templateCard));
+                                            
+                                            // 更新 children 数组中的值
+                                            newCard.children.forEach(child => {
+                                                if (child.itemAssociatedField && row[child.itemAssociatedField] !== undefined) {
+                                                    child.value = row[child.itemAssociatedField];
+                                                }
+                                                if(child.type === 'elButton'){
+                                                   console.log('child',child);
+                                                //      要跳转的页面id 
+                                                   let cardButtonTZYM = child?.cardButtonTZYM;
+                                                   let itemAssociatedField = child?.itemAssociatedField;
+                                                   let itemAssociatedFieldTZ = child?.itemAssociatedFieldTZ;
+                                                   let clickString = 
+                                                   '$FNX:let targetChild = $inject.rule['+index+'].children.find(child => child.itemAssociatedField === "'+itemAssociatedField+'");' +
+                                                   'let targetChildTZ = $inject.rule['+index+'].children.find(child => child?.itemAssociatedField === "'+itemAssociatedFieldTZ+'");' +
+                                                   'let targetValue = targetChild ? targetChild.value : null;' +
+                                                   'let targetValueTZ = targetChildTZ ? targetChildTZ.value : null;' +
+                                                   'let targetValueTZArray = ["'+itemAssociatedFieldTZ+'", targetValueTZ];' +
+                                                   'console.log("跳转页面ID:", "'+cardButtonTZYM+'");' +
+                                                   'console.log("关联字段值:", targetValue);' +
+                                                   'console.log("跳转列值:", targetValueTZ);' +
+                                                   'console.log("关联字段:", "'+itemAssociatedField+'");' +
+                                                   'console.log("跳转列:", "'+itemAssociatedFieldTZ+'");' +
+                                                   'console.log("跳转列数组:", targetValueTZArray);' +
+                                                   'fetch("'+this.baseUrl+'api/mobilePageDesignData/queryMobileClickAddData/'+cardButtonTZYM+'", {' +
+                                                   '    method: "GET",' +
+                                                   '    headers: {' +
+                                                   '        "Accept": "application/json",' +
+                                                   '        "dbname": "'+this.headers.dbname+'",' +
+                                                   '        "Content-Type": "application/json"' +
+                                                   '    }' +
+                                                   '}).then(response => {' +
+                                                   '    if (!response.ok) {' +
+                                                   '        throw new Error("HTTP error! status: " + response.status);' +
+                                                   '    }' +
+                                                   '    return response.json();' +
+                                                   '}).then(data => {' +
+                                                   '    console.log("htmlData", data?.data?.htmlData);' +
+                                                   '    const decodedHtml = decodeURIComponent(data?.data?.htmlData);' +
+                                                   '    const iframe = document.createElement("iframe");' +
+                                                   '    iframe.srcdoc = decodedHtml;' +
+                                                   '    iframe.style.width = "100%";' +
+                                                   '    iframe.style.height = "100vh";' +
+                                                   '    iframe.style.border = "none";' +
+                                                   '    document.body.innerHTML = "";' +
+                                                   '    document.body.appendChild(iframe);' +
+                                                   '    iframe.onload = function() {' +
+                                                   '        try {' +
+                                                   '            const iframeWindow = iframe.contentWindow;' +
+                                                   '            setTimeout(() => {' +
+                                                   '                const vueInstance = iframeWindow.document.querySelector("#app").__vue__;' +
+                                                   '                if (vueInstance) {' +
+                                                   '                    vueInstance?.searchCardList(targetValue, targetValueTZArray);' +
+                                                   '                }' +
+                                                   '            }, 1000);' +
+                                                   '        } catch (error) {' +
+                                                   '            console.error("调用 iframe 方法时出错:", error);' +
+                                                   '        }' +
+                                                   '    };' +
+                                                   '}).catch(error => {' +
+                                                   '    console.error("调用接口出错:", error);' +
+                                                   '});';
+                                                    child.on = {
+                                                        'click': clickString
+                                                    };
+                                                   console.log('child-on',child.on);
+                                                }
+                                            });
+                                            // 更新 _fc_id 和 name，确保唯一性
+                                          newCard._fc_id = \`\${newCard._fc_id}_\${index}\`;
+                                            newCard.name = \`\${newCard.name}_\${index}\`;
+                                            return newCard;
+                                        });
+                                        // 更新 this.rule
+                                        this.rule = newRule;
+                                        console.log('更新后的 rule:', this.rule);
+                                    }
+                                } else {
+                                    console.warn('接口返回非 200 状态:', data);
+                                }
+                            });
+                    },
+                     searchCardList(value,id){
+                         if(value) this.selectValue = value
+                         if(id){
+                               console.log('id',id)
+                               console.log('this.cardColumnTZJS',this.cardColumnTZJS,id[1])
+                               // 如果有id和cardColumnTZJS,保存到data中供后续查询使用
+                               if(id && this.cardColumnTZJS) {
+                                 this.savedTZJSValue = id[1];
+                               }
+                         }
+                        if(this.oldFlag){
+                         let params;
+                         const originalPageId = this.cardList.pageId;
+                         let savedCardColumn;
+                         // 先保存一份原始的cardColumn
+                         const cardItem = this.rule.find(item => item.type === 'elCard');
+                         savedCardColumn = cardItem?.cardColumn;
+                         let { pageNum, pageSize} = this.cardList;
+                         // 添加搜索参数
+                         params = {
+                             pageId: originalPageId,
+                             pageNum,
+                             pageSize,
+                             ...(this.selectValue && savedCardColumn ? {[savedCardColumn]: this.selectValue} : {}),
+                             ...(this.savedTZJSValue ? {[this.cardColumnTZJS]:this.savedTZJSValue} : {})
+                             };
+                         console.log('originalPageId',params)
+                          
+                             this.getTableLimitInfo(params);
+                        }else{
+                            // 直接使用 cardList 中的参数，不需要遍历
+                        
+                             const originalPageId = this.cardList.pageId;
+                            let { pageId, pageNum, pageSize} = this.cardList;
+                            // 添加搜索参数
+                            let params = {
+                                pageId: originalPageId, 
+                                pageNum,
+                                pageSize,
+                                ...(this.selectValue ? {[this.selectRc]: this.selectValue} : {})
+                            }; 
+                            // 调用接口
+                            this.getCardCycleNew(params);
+                        }
                     },
                     async getTableLimitInfo(params = {}) {
                             const endpoint = 'api/mobilePageDesignData/muti/tableLimitInfo';
@@ -694,6 +913,70 @@ export function htmlTemplateCard(json, options,zkqyData,dataSource,url) {
                                                 if (child.columnItem && row[child.columnItem] !== undefined) {
                                                     child.value = row[child.columnItem];
                                                 }
+                                                 if(child.type === 'elButton'){
+                                                   console.log('child',child);
+                                                   let cardButtonTZYM = child?.cardButtonTZYM;
+                                                   let cardButtonColumn = child;
+                                                   //   绑定字段 columnItem
+                                                   let columnItem = child?.columnItem;
+                                                   //   跳转字段 columnItemTZPT
+                                                   let columnItemTZPT = child?.columnItemTZPT;
+                                                   let clickString = 
+                                                   '$FNX:let targetChild = $inject.rule['+index+'].children.find(child => child.columnItem === "'+columnItem+'");' +
+                                                   'let targetChildTZ = $inject.rule['+index+'].children.find(child => child?.columnItem === "'+columnItemTZPT+'");' +
+                                                   'let targetValue = targetChild ? targetChild.value : null;' +
+                                                   'let targetValueTZ = targetChildTZ ? targetChildTZ.value : null;' +
+                                                   'let targetValueTZArray = ["'+columnItemTZPT+'", targetValueTZ];' +
+                                                   'console.log("跳转页面ID:", "'+cardButtonTZYM+'");' +
+                                                   'console.log("绑定字段值:", targetValue);' +
+                                                   'console.log("跳转字段值:", targetValueTZ);' +
+                                                   'console.log("绑定字段:", "'+columnItem+'");' +
+                                                   'console.log("跳转列:", "'+columnItemTZPT+'");' +
+                                                   'console.log("跳转列数组:", targetValueTZArray);' +
+                                                   'fetch("'+this.baseUrl+'api/mobilePageDesignData/queryMobileClickAddData/'+cardButtonTZYM+'", {' +
+                                                   '    method: "GET",' +
+                                                   '    headers: {' +
+                                                   '        "Accept": "application/json",' +
+                                                   '        "dbname": "'+this.headers.dbname+'",' +
+                                                   '        "Content-Type": "application/json"' +
+                                                   '    }' +
+                                                   '}).then(response => {' +
+                                                   '    if (!response.ok) {' +
+                                                   '        throw new Error("HTTP error! status: " + response.status);' +
+                                                   '    }' +
+                                                   '    return response.json();' +
+                                                   '}).then(data => {' +
+                                                   '    console.log("htmlData", data?.data?.htmlData);' +
+                                                   '    const decodedHtml = decodeURIComponent(data?.data?.htmlData);' +
+                                                   '    const iframe = document.createElement("iframe");' +
+                                                   '    iframe.srcdoc = decodedHtml;' +
+                                                   '    iframe.style.width = "100%";' +
+                                                   '    iframe.style.height = "100vh";' +
+                                                   '    iframe.style.border = "none";' +
+                                                   '    document.body.innerHTML = "";' +
+                                                   '    document.body.appendChild(iframe);' +
+                                                   '    iframe.onload = function() {' +
+                                                   '        try {' +
+                                                   '            const iframeWindow = iframe.contentWindow;' +
+                                                   '            setTimeout(() => {' +
+                                                   '                const vueInstance = iframeWindow.document.querySelector("#app").__vue__;' +
+                                                   '                if (vueInstance) {' +
+                                                   '                    vueInstance?.searchCardList(targetValue, targetValueTZArray);' +
+                                                   '                }' +
+                                                   '            }, 1000);' +
+                                                   '        } catch (error) {' +
+                                                   '            console.error("调用 iframe 方法时出错:", error);' +
+                                                   '        }' +
+                                                   '    };' +
+                                                   '}).catch(error => {' +
+                                                   '    console.error("调用接口出错:", error);' +
+                                                   '});';
+                                                    child.on = {
+                                                        'click': clickString
+                                                    };
+
+                                                   console.log('child-on',child.on);
+                                                }
                                             });
                                             
                                             // 更新 _fc_id 和 name，确保唯一性
@@ -703,9 +986,17 @@ export function htmlTemplateCard(json, options,zkqyData,dataSource,url) {
                                             return newCard;
                                         });
                                         
-                                        // 更新 this.rule
-                                        this.rule = newRule;
+                                        // 更新 this.rule，确保保留 __fc__ 属性
+                                        if (newRule.length > 0) {
+                                            this.rule = newRule;
+                                        } else {
+                                            // 如果没有数据，使用原始模板
+                                            this.rule = [templateCard];
+                                        }
                                         console.log('更新后的 rule:', this.rule);
+                                    } else {
+                                        // 如果没有找到模板卡片，使用原始规则
+                                        this.rule = this.originalRule || [];
                                     }
                                 } else {
                                     console.warn('接口返回非 200 状态:', data);