@idooel/components 0.0.2-beta.20 → 0.0.2-beta.22

package/dist/@idooel/components.esm.js

@@ -3281,7 +3281,10 @@ var script$A = {
           ...this.exposed
         });
       } else {
-        if (this.showTree) return;
+        const {
+          initSearch = false
+        } = props;
+        if (this.showTree && initSearch) return;
         this.tableData = await this.requestTableData();
       }
     },
@@ -3634,11 +3637,11 @@ __vue_render__$A._withStripped = true;
   /* style */
   const __vue_inject_styles__$A = function (inject) {
     if (!inject) return
-    inject("data-v-6e8ad2fe_0", { source: ".ele.model__tree-table[data-v-6e8ad2fe] {\n  background: transparent;\n  display: flex;\n  flex-direction: row;\n  width: 100%;\n}\n.ele.model__tree-table .model__tree-table--container .model__tree--wrapper[data-v-6e8ad2fe] {\n  width: 240px;\n  background: #fff;\n  flex-shrink: 0;\n  padding: 16px;\n  box-sizing: border-box;\n  margin-right: 16px;\n  overflow-y: auto;\n}\n.ele.model__tree-table .model__table--container[data-v-6e8ad2fe] {\n  width: 100%;\n  min-width: 0;\n  background: #fff;\n}\n.ele.model__tree-table .model__table--container .model__table--title .model__table-title--bar[data-v-6e8ad2fe] {\n  width: 100%;\n  height: 8px;\n  background: var(--idooel-primary-color);\n  border-top-left-radius: 4px;\n  border-top-right-radius: 4px;\n}\n.ele.model__tree-table .model__table--container .model__table--title .model__table-title--text[data-v-6e8ad2fe] {\n  text-align: left;\n  padding: 16px;\n  font-size: 16px;\n  font-weight: bold;\n  background: #fff;\n  border-bottom: 1px solid;\n  border-color: var(--idoole-black-016);\n}\n.ele.model__tree-table .model__table--container .model__table--wrapper[data-v-6e8ad2fe] {\n  background: #fff;\n}\n.ele.model__tree-table .model__table--container .model__table--wrapper .button-row__area[data-v-6e8ad2fe] {\n  width: 100%;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n  padding-top: 16px;\n  padding-bottom: 8px;\n  padding-right: 16px;\n}\n.ele.model__tree-table .model__table--container .model__table--wrapper .g-table__wrapper .fsm[data-v-6e8ad2fe] {\n  cursor: pointer;\n  color: var(--idooel-primary-color);\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["C:\\Users\\ZOU\\Code\\OnlineStudy\\base-elearning-frontend-model\\packages\\components\\packages\\models\\tree-table-model\\src\\index.vue","index.vue"],"names":[],"mappings":"AAgwBA;EACA,uBAAA;EACA,aAAA;EACA,mBAAA;EACA,WAAA;AC/vBA;ADiwBA;EACA,YAAA;EACA,gBAAA;EACA,cAAA;EACA,aAAA;EACA,sBAAA;EACA,kBAAA;EACA,gBAAA;AC/vBA;ADkwBA;EACA,WAAA;EACA,YAAA;EACA,gBAAA;AChwBA;ADkwBA;EACA,WAAA;EACA,WAAA;EACA,uCAAA;EACA,2BAAA;EACA,4BAAA;AChwBA;ADkwBA;EACA,gBAAA;EACA,aAAA;EACA,eAAA;EACA,iBAAA;EACA,gBAAA;EACA,wBAAA;EACA,qCAAA;AChwBA;ADmwBA;EACA,gBAAA;ACjwBA;ADkwBA;EACA,WAAA;EACA,aAAA;EACA,mBAAA;EACA,mBAAA;EACA,8BAAA;EACA,iBAAA;EACA,mBAAA;EACA,mBAAA;AChwBA;ADmwBA;EACA,eAAA;EACA,kCAAA;ACjwBA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["<template>\r\n  <section class=\"ele model__tree-table\">\r\n    <section class=\"model__tree-table--container\" v-if=\"showTree\">\r\n      <div class=\"model__tree--title\"></div>\r\n      <section :ref=\"modelTreeWrapper\" class=\"model__tree--wrapper\" :style=\"{height: `${treeWrapperHeight}px`}\">\r\n        <ele-tree\r\n          :tree-data=\"treeData\"\r\n          :defaultExpandedKeys=\"defaultExpandedKeys\"\r\n          :defaultSelectedKeys=\"defaultSelectedKeys\"\r\n          @select=\"selectTreeNode\"\r\n          :replace-fields=\"mapFields\">\r\n        </ele-tree>\r\n      </section>\r\n    </section>\r\n    <section class=\"model__table--container\" :ref=\"modelTableContainerRef\">\r\n      <div class=\"model__table--title\" v-if=\"title\">\r\n        <template v-if=\"titleMode\">\r\n          <div :class=\"[`model__table-title--${titleMode}`]\"></div>\r\n        </template>\r\n        <template v-else>\r\n          <div class=\"model__table-title--text\">{{ title }}</div>\r\n        </template>\r\n      </div>\r\n      <section :ref=\"modelTableWrapper\" class=\"model__table--wrapper\">\r\n        <ele-search-area :ref=\"searchArea\" @search=\"onSearch\" :data-source=\"searchMeta.elements\"></ele-search-area>\r\n        <div class=\"button-row__area\">\r\n          <ele-button-group class=\"model-table__button-group\" v-on=\"overrideButtonGroupEvent\" :ref=\"buttonGroup\" @click=\"handleClickButtonGroup\" :data-source=\"getButtonGroupElements\"></ele-button-group>\r\n          <slot name=\"tags\"></slot>\r\n          <slot v-if=\"$slots['sub-center']\" name=\"sub-center\"></slot>\r\n        </div>\r\n        <ele-table\r\n          v-on=\"overrideTableEvent\"\r\n          :ref=\"tableRef\"\r\n          :row-selection=\"rowSelection\"\r\n          :loading=\"loading\" \r\n          :columns=\"columns\"\r\n          :total=\"total\"\r\n          :x=\"x\"\r\n          :y=\"y\"\r\n          :bordered=\"setBorder\"\r\n          :height=\"tableHeight\"\r\n          :width=\"tableWidth\"\r\n          :actions=\"actions\"\r\n          :pageSize=\"pageSize\"\r\n          :pageSizeOptions=\"pageSizeOptions\"\r\n          :data-source=\"tableData\"\r\n          @change-page=\"onChangePage\"\r\n        ></ele-table>\r\n      </section>\r\n    </section>\r\n    <ele-modal-form v-model=\"modalFormValue\" v-on=\"overrideModalFormEvent\" :meta=\"modalFormMeta\"></ele-modal-form>\r\n    <ele-modal-fsm v-model=\"showFsmModal\" :contextProp=\"fsmContextProp\" :meta=\"fsmMeta\" @cancel=\"handleCloseFsmModal\"></ele-modal-fsm>\r\n    <ele-modal-table\r\n      :meta=\"modalTableMeta\"\r\n      v-model=\"modalTableValue\"\r\n      v-on=\"overrideModalTableEvent\"\r\n    ></ele-modal-table>\r\n  </section>\r\n</template>\r\n\r\n<script>\r\nimport { type, net } from '@idooel/shared'\r\nimport { v4 as uuidv4 } from 'uuid'\r\nimport { BUILT_IN_EVENT_NAMES, RESERVE_EVENT_NAMES, parseFieldMap, BUILT_IN_TRIGGER, CONTEXT } from '../../../utils'\r\nimport { createTreeTableModel } from '../../../utils/runtime-context'\r\nexport default {\r\n  name: 'ele-tree-table-model',\r\n  props: {\r\n    title: {\r\n      type: [Object, String]\r\n    },\r\n    overHeight: {\r\n      type: Number,\r\n      default: 0\r\n    },\r\n    treeMeta: {\r\n      type: Object,\r\n      default: () => ({})\r\n    },\r\n    searchMeta: {\r\n      type: Object,\r\n      default: () => ({})\r\n    },\r\n    buttonGroupMeta: {\r\n      typeof: Object,\r\n      default: () => ({})\r\n    },\r\n    tableMeta: {\r\n      type: Object,\r\n      default: () => ({})\r\n    },\r\n    createMeta: {\r\n      type: Object\r\n    },\r\n    editMeta: {\r\n      type: Object\r\n    }\r\n  },\r\n  provide () {\r\n    return {\r\n      requestTreeData: this.requestTreeData,\r\n      requestTableData: this.requestTableData,\r\n      keepAliveRefresh: this.keepAliveRefresh,\r\n      [CONTEXT]: () => {\r\n        return {\r\n          exposed: this.exposed\r\n        }\r\n      }\r\n    }\r\n  },\r\n  data () {\r\n    return {\r\n      tableHeight: 0,\r\n      tableWidth: 0,\r\n      modalFormMeta: {},\r\n      modalFormValue: false,\r\n      treeData: [],\r\n      tableData: [],\r\n      defaultExpandedKeys: [],\r\n      defaultSelectedKeys: [],\r\n      replaceFields: {\r\n        title: 'title',\r\n        children: 'children',\r\n        key: 'id'\r\n      },\r\n      loading: false,\r\n      total: 0,\r\n      tableQuerys: {},\r\n      resizeObserverModelTableWrapper: null,\r\n      modelTableWrapperHeight: 0,\r\n      currentTreeNodeData: {},\r\n      currentRowData: {},\r\n      treeWrapperHeight: 0,\r\n      currentTableSelection: this.currentTableMode == 'radio' ? {} : [],\r\n      showFsmModal: false,\r\n      fsmMeta: {},\r\n      fsmContextProp: {},\r\n      modalTableValue: false,\r\n      modalTableMeta: {},\r\n      dataPoolManager: null\r\n    }\r\n  },\r\n  computed: {\r\n    setBorder () {\r\n      return this.tableMeta.bordered === false ? false : true\r\n    },\r\n    rowSelection () {\r\n      if (!this.currentTableMode) return void 0\r\n      return {\r\n        columnTitle: this.currentSelectionColumn.columnTitle,\r\n        fixed: true,\r\n        type: this.currentTableMode,\r\n        onChange: this.onChangeTableSelection\r\n      }\r\n    },\r\n    currentSelectionColumn () {\r\n      const { multiple } = this.tableMeta\r\n      const target = this.columns.find(item => Object.keys(item).includes('multiple'))\r\n      const isGlobalExistMultiple = Object.keys(this.tableMeta).includes('multiple')\r\n      if (target) {\r\n        return target\r\n      } else if (isGlobalExistMultiple) {\r\n        return { multiple }\r\n      }\r\n      return void 0\r\n    },\r\n    x () {\r\n      const { x } = this.tableMeta\r\n      return x\r\n    },\r\n    y () {\r\n      const { y } = this.tableMeta\r\n      return y\r\n    },\r\n    currentTableMode () {\r\n      if (!this.currentSelectionColumn) return void 0\r\n      const { multiple } = this.currentSelectionColumn\r\n      if (type.isBool(multiple)) {\r\n        if (multiple) {\r\n          return 'checkbox'\r\n        } else {\r\n          return 'radio'\r\n        }\r\n      } else {\r\n        return void 0\r\n      }\r\n    },\r\n    modelTableContainerRef () {\r\n      return uuidv4()\r\n    },\r\n    titleMode () {\r\n      if (type.isObject(this.title)) {\r\n        const { mode = '' } = this.title\r\n        return mode\r\n      }\r\n      return void 0\r\n    },\r\n    tableRef () {\r\n      return uuidv4()\r\n    },\r\n    exposed () {\r\n      return {\r\n        showModalForm: this.showModalForm,\r\n        closeModalForm: this.closeModalForm,\r\n        showModalTable: this.showModalTable,\r\n        closeModalTable: this.closeModalTable,\r\n        currentTableSelection: this.currentTableSelection,\r\n        currentTreeNode: this.currentTreeNodeData,\r\n        requestTableData: this.requestTableData,\r\n        keepAliveRefresh: this.keepAliveRefresh,\r\n        refreshTreeData: this.refreshTreeData,\r\n        querys: this.tableQuerys,\r\n        currentRowData: this.getCurrentRowData(),\r\n        getCurrentRowData: this.getCurrentRowData,\r\n        setCurrentRowData: this.setCurrentRowData,\r\n        setCurrentTableSelection: this.setCurrentTableSelection,\r\n        getCurrentTableSelection: this.getCurrentTableSelection,\r\n        cleanCurrentModelEffect: this.cleanCurrentModelEffect,\r\n        route: this.$route,\r\n        _route: this.$route.query,\r\n        _routeMeta: this.$route.meta,\r\n        dataPool: this.model ? this.model.getDataPool() : null,\r\n        dataPoolManager: this.model || null\r\n      }\r\n    },\r\n    overrideTableEvent () {\r\n      const events = this.actions.reduce((ret, action) => {\r\n        ret[action.eventName || action.key] = (e) => {\r\n          this.setCurrentRowData(e.exposed.currentRowData)\r\n          const { target } = action\r\n          const targetMeta = this.findMetaByKey(target)\r\n          const { mode } = targetMeta\r\n          mode && this.dispatchTrigger({ mode, record: e.exposed.currentRowData, modeMeta: targetMeta })\r\n          this.$emit(action.eventName || action.key, { ...e, currentTreeNode: this.currentTreeNodeData, exposed: { ...this.exposed, ...e.exposed } })\r\n        }\r\n        return ret\r\n      }, {})\r\n      return {\r\n        ...this.$listeners,\r\n        ...events,\r\n        [BUILT_IN_EVENT_NAMES.EDIT]: this[BUILT_IN_EVENT_NAMES.EDIT],\r\n        [BUILT_IN_EVENT_NAMES.SUBMIT]: this[BUILT_IN_EVENT_NAMES.SUBMIT]\r\n      }\r\n    },\r\n    overrideModalFormEvent () {\r\n      const { footerMeta } = this.modalFormMeta\r\n      const { elements = [] } = footerMeta || {}\r\n      const eles = type.isFunction(elements) ? elements.call(this) : elements\r\n      const events = eles.reduce((ret, ele) => {\r\n        ret[ele.eventName] = (e = {}) => {\r\n          if (ele.eventName === 'cancel') {\r\n            this.closeModalForm()\r\n          } else {\r\n            const { exposed = {} } = e\r\n            this.$emit(`${ele.eventName || ele.key}`, { ...e, currentTreeNode: this.currentTreeNodeData, exposed: Object.assign({}, exposed )})\r\n          }\r\n        }\r\n        return ret\r\n      }, {})\r\n      return {\r\n        ...events\r\n      }\r\n    },\r\n    overrideModalTableEvent () {\r\n      const { footerMeta } = this.modalTableMeta\r\n      const { elements = [] } = footerMeta || {}\r\n      const eles = type.isFunction(elements) ? elements.call(this) : elements\r\n      const events = eles.reduce((ret, ele) => {\r\n        ret[ele.eventName] = (e = {}) => {\r\n          if (ele.eventName === 'cancel') {\r\n            this.closeModalTable()\r\n          } else {\r\n            const { exposed = {} } = e\r\n            this.$emit(`${ele.eventName || ele.key}`, { ...e, currentTreeNode: this.currentTreeNodeData, exposed: Object.assign({}, exposed )})\r\n          }\r\n        }\r\n        return ret\r\n      }, {})\r\n      return {\r\n        ...events,\r\n        exposed: this.exposed\r\n      }\r\n    },\r\n    overrideButtonGroupEvent () {\r\n      const events = this.getButtonGroupElements.reduce((ret, ele) => {\r\n        ret[ele.eventName] = (e) => {\r\n          this.$emit(ele.eventName || 'click', { ...e, currentTreeNode: this.currentTreeNodeData, exposed: Object.assign({}, e.exposed || {}, this.exposed)})\r\n        }\r\n        return ret\r\n      }, {})\r\n      return {\r\n        ...this.$listeners,\r\n        ...events,\r\n        [BUILT_IN_EVENT_NAMES.CREATE]: this[BUILT_IN_EVENT_NAMES.CREATE],\r\n        exposed: this.exposed\r\n      }\r\n    },\r\n    showTree () {\r\n      return !!Object.keys(this.treeMeta).length\r\n    },\r\n    buttonGroup () {\r\n      return uuidv4()\r\n    },\r\n    searchArea () {\r\n      return uuidv4()\r\n    },\r\n    modelTreeWrapper () {\r\n      return uuidv4()\r\n    },\r\n    modelTableWrapper () {\r\n      return uuidv4()\r\n    },\r\n    actions () {\r\n      const { operations } = this.tableMeta\r\n      if (operations) {\r\n        return operations.elements\r\n      } else {\r\n        return []\r\n      }\r\n    },\r\n    pageSize () {\r\n      const { page = {} } = this.tableMeta\r\n      return page.pageSize || 10\r\n    },\r\n    pageSizeOptions () {\r\n      const { page = {} } = this.tableMeta\r\n      return page.pageSizeOptions || ['10', '20', '30', '40']\r\n    },\r\n    columns () {\r\n      const { columns, operations } = this.tableMeta\r\n      if (type.get(columns) === 'array') {\r\n        const columnsOptions = columns.map(item => {\r\n          const { mode = 'text' } = item\r\n          if (item.render) {\r\n            return {\r\n              ...item,\r\n              customRender: (text, record, index) => {\r\n                const { $createElement } = this\r\n                return item.render.call(this, \r\n                  { h: $createElement, ctx: this },\r\n                  text ? typeof text == 'object' ? text[item.dataIndex] : text : '', \r\n                  record, index)\r\n              }\r\n            }\r\n          } else if (mode !== BUILT_IN_TRIGGER.TEXT) {\r\n            const { [`${mode}Meta`]: modeMeta } = item\r\n            return {\r\n              ...item,\r\n              customRender: (text, record, index) => {\r\n                return <span onClick={() => this.dispatchTrigger({ mode, record, modeMeta, index })} class={ mode }>{ text }</span>\r\n              }\r\n            }\r\n          }\r\n          return {\r\n            ...item\r\n          }\r\n        })\r\n        if (operations) {\r\n          return [\r\n            ...columnsOptions,\r\n            {\r\n              title: '操作',\r\n              width: operations.width,\r\n              key: 'action',\r\n              fixed: 'right',\r\n              scopedSlots: { customRender: 'action' }\r\n            }\r\n          ]\r\n        }\r\n        return columnsOptions\r\n      } else {\r\n        console.error('Error: columns is invalid, please check it')\r\n        return []\r\n      }\r\n    },\r\n    getButtonGroupElements () {\r\n      const { elements } = this.buttonGroupMeta\r\n      if (type.get(elements) === 'function') {\r\n        return elements.call(this)\r\n      } else if (type.get(elements) === 'array') {\r\n        return elements\r\n      } else {\r\n        return []\r\n      }\r\n    },\r\n    mapFields () {\r\n      const { replaceFields = {} } = this.treeMeta\r\n      const mapFields = type.isEmpty(replaceFields) ? this.replaceFields : replaceFields\r\n      return mapFields\r\n    }\r\n  },\r\n  async created () {\r\n    // onSearch会初始化请求表格数据，所以不需要在这里请求表格数据\r\n    // 确保全局数据池已初始化\r\n    if (!window.__idooel_data_pool__) {\r\n      console.error('Global data pool not initialized. Please check if runtime-context/globalDataPool.js is properly imported.')\r\n      return\r\n    }\r\n    \r\n    // 初始化数据池管理器（使用新的 runtime-context）\r\n    try {\r\n      this.model = createTreeTableModel('treeTableModel')\r\n      \r\n      if (!this.model) {\r\n        throw new Error('Failed to create tree table model')\r\n      }\r\n    } catch (error) {\r\n      console.error('Error creating tree table model:', error)\r\n      this.model = null\r\n      return\r\n    }\r\n    \r\n    // 初始化 currentRowData（尝试从共享命名空间获取）\r\n    this.initializeCurrentRowData()\r\n    \r\n    // 订阅数据池变化\r\n    this.unsubscribe = this.model.subscribe('currentRowData', (event) => {\r\n      this.currentRowData = event.value || {}\r\n      this.$forceUpdate()\r\n    })\r\n    \r\n    // 订阅共享数据变化\r\n    this.unsubscribeShared = this.model.subscribeShared((event) => {\r\n      // 当有新的共享数据时，更新当前组件的 currentRowData\r\n      if (event.value && Object.keys(event.value).length > 0) {\r\n        this.setCurrentRowData(event.value)\r\n      }\r\n    })\r\n    \r\n    if (this.showTree) {\r\n      this.treeData = await this.requestTreeData()\r\n      const [defaultTreeNode = {}] = this.treeData\r\n      this.defaultExpandedKeys = [defaultTreeNode[this.mapFields.key]]\r\n      this.defaultSelectedKeys = [defaultTreeNode[this.mapFields.key]]\r\n      this.currentTreeNodeData = defaultTreeNode\r\n      const { params = {}, fieldMap = {}, overrideInit = false } = this.tableMeta\r\n      const currentRowData = this.getCurrentRowData()\r\n      const ctx = { \r\n        ...this.currentTreeNodeData, \r\n        _route: this.$route.query, \r\n        currentRowData: currentRowData\r\n      }\r\n      \r\n      const initQuerys = Object.assign({}, params, parseFieldMap(fieldMap, ctx))\r\n      if (overrideInit) {\r\n        this.$emit(RESERVE_EVENT_NAMES.INIT, { ...this.exposed })\r\n      } else {\r\n        this.tableData = await this.requestTableData(initQuerys)\r\n      }\r\n    }\r\n  },\r\n  methods: {\r\n    initializeCurrentRowData () {\r\n      if (!this.model) {\r\n        console.warn('Model not initialized, skipping currentRowData initialization')\r\n        return\r\n      }\r\n      \r\n      // 检查是否有来自父组件的共享数据（比如 modal table 场景）\r\n      const parentData = this.model.getSharedData()\r\n      \r\n      if (parentData && Object.keys(parentData).length > 0) {\r\n        this.setCurrentRowData(parentData)\r\n        return\r\n      }\r\n      \r\n      // 可以根据路由参数、props 或其他来源设置初始的 currentRowData\r\n      const { query } = this.$route\r\n      \r\n      // 示例：如果路由中有特定参数，可以设置为 currentRowData\r\n      if (query.rowId || query.selectedId) {\r\n        // 这里可以根据实际需求从服务端或其他地方获取数据\r\n        // const presetData = { id: query.rowId, /* 其他字段 */ }\r\n        // this.setCurrentRowData(presetData)\r\n      }\r\n      \r\n      // 目前保持空对象，等待用户选择行数据\r\n    },\r\n    async refreshTreeData () {\r\n      this.treeData = await this.requestTreeData()\r\n      const [defaultTreeNode = {}] = this.treeData\r\n      this.defaultExpandedKeys = [defaultTreeNode[this.mapFields.key]]\r\n      this.defaultSelectedKeys = [defaultTreeNode[this.mapFields.key]]\r\n      this.currentTreeNodeData = defaultTreeNode\r\n    },\r\n    dispatchTrigger ({ mode, record = {}, modeMeta = { } }) {\r\n      switch (mode) {\r\n        case BUILT_IN_TRIGGER.FSM:\r\n          this[`${BUILT_IN_TRIGGER.FSM}Trigger`](record, modeMeta = type.isEmpty(modeMeta) ? { \r\n            url: 'api-fsm/workbench/fsm/auditFlow',\r\n            requestType: 'GET',\r\n            fieldMap: {\r\n              modelCode: 'modelCode',\r\n              businessId: 'businessId'\r\n            }\r\n          } : modeMeta)\r\n          break\r\n        case BUILT_IN_TRIGGER.ELE_MODAL_FORM:\r\n          this.modalFormMeta = modeMeta\r\n          this.showModalForm(modeMeta)\r\n          break\r\n        case BUILT_IN_TRIGGER.ELE_MODAL_TABLE:\r\n          this.modalTableMeta = modeMeta\r\n          // 将当前行的 record 数据传递给 modal table\r\n          this.showModalTable(modeMeta, record)\r\n          break\r\n        default:\r\n          break\r\n      }\r\n    },\r\n    handleCloseFsmModal () {\r\n      this.showFsmModal = false\r\n    },\r\n    [`${BUILT_IN_TRIGGER.FSM}Trigger`] (record, meta) {\r\n      this.fsmMeta = meta\r\n      this.fsmContextProp = record\r\n      this.showFsmModal = true\r\n    },\r\n    onChangeTableSelection (_, selectedRows = []) {\r\n      if (this.currentTableMode === 'radio') {\r\n        this.setCurrentTableSelection(selectedRows)\r\n        this.$emit('on-change-table-selection', this.currentTableSelection)\r\n        this.$emit('x:refresh-exposed', { exposed: this.exposed })\r\n      } else {\r\n        this.setCurrentTableSelection(selectedRows)\r\n        this.$emit('on-change-table-selection', this.currentTableSelection)\r\n        this.$emit('x:refresh-exposed', { exposed: this.exposed })\r\n      }\r\n    },\r\n    setCurrentTableSelection (props = {}) {\r\n      if (this.currentTableMode === 'radio') {\r\n        this.$set(this, 'currentTableSelection', (type.isArray(props) && props.length > 0) ? props[0] : type.isObject(props) ? props : {})\r\n      } else {\r\n        this.$set(this, 'currentTableSelection', type.isArray(props) ? props : [])\r\n      }\r\n    },\r\n    getCurrentTableSelection () {\r\n      return this.currentTableSelection\r\n    },\r\n    setCurrentRowData (props = {}) {\r\n      this.currentRowData = props\r\n      if (this.model) {\r\n        this.model.setCurrentRowData(props)\r\n      } else {\r\n        console.warn('Model not initialized, cannot setCurrentRowData in model')\r\n      }\r\n    },\r\n    getCurrentRowData () {\r\n      if (this.model) {\r\n        return this.model.getCurrentRowData()\r\n      }\r\n      console.warn('Model not initialized, getCurrentRowData returning local data')\r\n      return this.currentRowData || {}\r\n    },\r\n    cleanCurrentModelEffect (clearRowData = true) {\r\n      this.setCurrentTableSelection()\r\n      if (clearRowData) {\r\n        this.setCurrentRowData({})\r\n      }\r\n    },\r\n    [BUILT_IN_EVENT_NAMES.SUBMIT] (props = {}) {\r\n      this.cleanCurrentModelEffect()\r\n      this.requestTableData()\r\n    },\r\n    [BUILT_IN_EVENT_NAMES.EDIT] (props = {}) {\r\n      const { record = {} } = props\r\n      this.setCurrentRowData(record)\r\n      this.modalFormMeta = this.editMeta\r\n      this.modalFormValue = true\r\n    },\r\n    [BUILT_IN_EVENT_NAMES.CREATE] () {\r\n      this.modalFormMeta = this.createMeta\r\n      this.modalFormValue = true\r\n    },\r\n    showModalForm (modeMeta = {}) {\r\n      if (type.isStr(modeMeta)) {\r\n        const targetMeta = this.findMetaByKey(modeMeta)\r\n        this.modalFormMeta = targetMeta\r\n      } else {\r\n        this.modalFormMeta = modeMeta\r\n      }\r\n      this.modalFormValue = true\r\n    },\r\n    showModalTable (modeMeta = {}, record = null) {\r\n      // 获取当前行数据并设置到共享命名空间\r\n      const currentRowData = record || this.getCurrentRowData()\r\n      if (this.model) {\r\n        this.model.setSharedData(currentRowData)\r\n      } else {\r\n        console.warn('Model not initialized, cannot setSharedData')\r\n      }\r\n      \r\n      let targetMeta = modeMeta\r\n      if (type.isStr(modeMeta)) {\r\n        targetMeta = this.findMetaByKey(modeMeta)\r\n      }\r\n      \r\n      // 解析 fieldMap 参数，使用完整的上下文包括 currentRowData\r\n      if (targetMeta && targetMeta.fieldMap) {\r\n        const { fieldMap, params = {} } = targetMeta\r\n        \r\n        const ctx = { \r\n          ...this.currentTreeNodeData, \r\n          _route: this.$route.query, \r\n          ...currentRowData \r\n        }\r\n        const parsedParams = parseFieldMap(fieldMap, ctx)\r\n        \r\n        // 将当前的 currentRowData 传递给 modal table，通过 params\r\n        targetMeta = {\r\n          ...targetMeta,\r\n          params: {\r\n            ...params,\r\n            ...parsedParams\r\n          }\r\n        }\r\n      }\r\n      \r\n      this.modalTableMeta = targetMeta\r\n      this.modalTableValue = true\r\n    },\r\n    closeModalForm () {\r\n      this.modalFormValue = false\r\n    },\r\n    closeModalTable () {\r\n      this.modalTableValue = false\r\n    },\r\n    findMetaByKey (key) {\r\n      return this.$attrs[key] || {}\r\n    },\r\n    handleClickButtonGroup (props) {\r\n      const { eventName, target } = props\r\n      const targetMeta = this.findMetaByKey(target)\r\n      const { mode } = targetMeta\r\n      mode && this.dispatchTrigger({ mode, modeMeta: targetMeta })\r\n      this.$emit(eventName || 'click', { currentTreeNode: this.currentTreeNodeData })\r\n    },\r\n    async onSearch (props) {\r\n      const { overrideInit = false } = this.tableMeta\r\n      this.tableQuerys = Object.assign(this.tableQuerys, props)\r\n      if (overrideInit) {\r\n        this.$emit(RESERVE_EVENT_NAMES.TREE_CHANGE, { ...this.exposed })\r\n      } else {\r\n        if (this.showTree) return\r\n        this.tableData = await this.requestTableData()\r\n      }\r\n    },\r\n    async selectTreeNode (selectedKeys, e) {\r\n      const { fieldMap } = this.tableMeta\r\n      this.currentTreeNodeData = e.node.$vnode.data.props.dataRef || {}\r\n      //@deprecated '_' namespace is deprecated, please use 'exposed' instead\r\n      const execFieldMapRet = parseFieldMap(fieldMap, { ...this.currentTreeNodeData, exposed: this.exposed, _route: this.exposed._route })\r\n      const { overrideInit = false } = this.tableMeta\r\n      if (overrideInit) {\r\n        this.$emit(RESERVE_EVENT_NAMES.TREE_CHANGE, { ...this.exposed })\r\n      } else {\r\n        this.tableData = await this.requestTableData(execFieldMapRet)\r\n      }\r\n    },\r\n    async requestTreeData () {\r\n      const { url, requestType = 'GET', params = {}, fieldMap = {} } = this.treeMeta\r\n      const fieldMapRet = parseFieldMap(fieldMap, { ...this.currentTreeNodeData, _route: this.$route.query })\r\n      const ret = await net[requestType.toLowerCase()](\r\n        url,\r\n        { ...params, ...fieldMapRet }\r\n      ).then(resp => {\r\n        const { data } = resp || {}\r\n        return data\r\n      })\r\n      return ret\r\n    },\r\n    async onChangePage (page, pageSize) {\r\n      this.tableData = await this.requestTableData({ currentPage: page, pageSize })\r\n    },\r\n    async requestTableData (props = {}) {\r\n      const { url, requestType = 'GET', page = {} } = this.tableMeta\r\n      this.tableQuerys = Object.assign(this.tableQuerys, { currentPage: this.tableQuerys.currentPage || 1, pageSize: this.tableQuerys.pageSize || 10 }, props)\r\n      this.$emit(RESERVE_EVENT_NAMES.WATCH, { ...this.exposed })\r\n      this.loading = true\r\n      const ret = await net[requestType.toLowerCase()](\r\n        url,\r\n        this.tableQuerys\r\n      ).then(resp => {\r\n        const { data = [], count } = resp || {}\r\n        this.total = count\r\n        this.loading = false\r\n        return (data || []).map(item => {\r\n          delete item.children\r\n          return {\r\n            key: uuidv4(),\r\n            ...item\r\n          }\r\n        })\r\n      })\r\n      this.cleanCurrentModelEffect(false) // 不清空 currentRowData，除非明确需要\r\n      this.tableData = ret\r\n      return ret\r\n    },\r\n    calculateTableHeight () {\r\n      const currentViewportHeight = window.innerHeight\r\n      const tableRef = this.$refs[this.tableRef]\r\n      const { top: tableToTop, width } = tableRef.$el.getBoundingClientRect()\r\n      this.tableWidth = width\r\n      this.tableHeight = currentViewportHeight - tableToTop - this.overHeight\r\n    },\r\n    calculateTreeHeight () {\r\n      if (!this.showTree) return\r\n      const modelTableContainerRef = this.$refs[this.modelTableContainerRef]\r\n      const { height } = modelTableContainerRef.getBoundingClientRect()\r\n      this.treeWrapperHeight = height\r\n    },\r\n    async keepAliveRefresh () {\r\n      // 重新计算表格高度（应对窗口大小变化）\r\n      this.$nextTick(() => {\r\n        this.calculateTableHeight()\r\n        if (this.showTree) {\r\n          this.calculateTreeHeight()\r\n        }\r\n      })\r\n      // 刷新列表数据\r\n      const { overrideInit = false } = this.tableMeta\r\n      if (overrideInit) {\r\n        // 如果使用自定义初始化模式，触发 INIT 事件\r\n        this.$emit(RESERVE_EVENT_NAMES.INIT, { ...this.exposed })\r\n      } else {\r\n        // 使用当前查询参数刷新表格数据\r\n        await this.requestTableData(this.tableQuerys)\r\n      }\r\n    }\r\n  },\r\n  mounted () {\r\n    this.calculateTableHeight()\r\n    this.$nextTick(() => {\r\n      this.calculateTreeHeight()\r\n    })\r\n    this.resizeObserverModelTableWrapper = new ResizeObserver(entries => {\r\n      for (const _ of entries) {\r\n        requestAnimationFrame(() => {\r\n          this.calculateTableHeight()\r\n        })\r\n      }\r\n    })\r\n    this.resizeObserverModelTableWrapper.observe(this.$refs[this.modelTableWrapper])\r\n  },\r\n  destroyed () {\r\n    this.resizeObserverModelTableWrapper.disconnect()\r\n    if (this.model) {\r\n      // 清理订阅\r\n      if (this.unsubscribe) {\r\n        this.unsubscribe()\r\n      }\r\n      if (this.unsubscribeShared) {\r\n        this.unsubscribeShared()\r\n      }\r\n      // 清理模型数据\r\n      if (this.model) {\r\n        this.model.cleanup()\r\n      }\r\n    }\r\n  },\r\n  async activated () {\r\n    await this.keepAliveRefresh()\r\n  }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.ele {\r\n  &.model__tree-table {\r\n    background: transparent;                                                                                                                                                                                                                 \r\n    display: flex;\r\n    flex-direction: row;\r\n    width: 100%;\r\n    .model__tree-table--container {\r\n      .model__tree--wrapper {\r\n        width: 240px;\r\n        background: #fff;\r\n        flex-shrink: 0;\r\n        padding: 16px;\r\n        box-sizing: border-box;\r\n        margin-right: 16px;\r\n        overflow-y: auto;\r\n      }\r\n    }\r\n    .model__table--container {\r\n      width: 100%;\r\n      min-width: 0;\r\n      background: #fff;\r\n      .model__table--title {\r\n        .model__table-title--bar {\r\n          width: 100%;\r\n          height: 8px;\r\n          background: var(--idooel-primary-color);\r\n          border-top-left-radius: 4px;\r\n          border-top-right-radius: 4px;\r\n        }\r\n        .model__table-title--text {\r\n          text-align: left;\r\n          padding: 16px;\r\n          font-size: 16px;\r\n          font-weight: bold;\r\n          background: #fff;\r\n          border-bottom: 1px solid;\r\n          border-color: var(--idoole-black-016);\r\n        }\r\n      }\r\n      .model__table--wrapper {\r\n        background: #fff;\r\n        .button-row__area {\r\n          width: 100%;\r\n          display: flex;\r\n          flex-direction: row;\r\n          align-items: center;\r\n          justify-content: space-between;\r\n          padding-top: 16px;\r\n          padding-bottom: 8px;\r\n          padding-right: 16px;\r\n        }\r\n        .g-table__wrapper {\r\n          .fsm {\r\n            cursor: pointer;\r\n            color: var(--idooel-primary-color);\r\n          }\r\n        }\r\n      }\r\n    }\r\n  }\r\n}\r\n</style>\r\n",".ele.model__tree-table {\n  background: transparent;\n  display: flex;\n  flex-direction: row;\n  width: 100%;\n}\n.ele.model__tree-table .model__tree-table--container .model__tree--wrapper {\n  width: 240px;\n  background: #fff;\n  flex-shrink: 0;\n  padding: 16px;\n  box-sizing: border-box;\n  margin-right: 16px;\n  overflow-y: auto;\n}\n.ele.model__tree-table .model__table--container {\n  width: 100%;\n  min-width: 0;\n  background: #fff;\n}\n.ele.model__tree-table .model__table--container .model__table--title .model__table-title--bar {\n  width: 100%;\n  height: 8px;\n  background: var(--idooel-primary-color);\n  border-top-left-radius: 4px;\n  border-top-right-radius: 4px;\n}\n.ele.model__tree-table .model__table--container .model__table--title .model__table-title--text {\n  text-align: left;\n  padding: 16px;\n  font-size: 16px;\n  font-weight: bold;\n  background: #fff;\n  border-bottom: 1px solid;\n  border-color: var(--idoole-black-016);\n}\n.ele.model__tree-table .model__table--container .model__table--wrapper {\n  background: #fff;\n}\n.ele.model__tree-table .model__table--container .model__table--wrapper .button-row__area {\n  width: 100%;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n  padding-top: 16px;\n  padding-bottom: 8px;\n  padding-right: 16px;\n}\n.ele.model__tree-table .model__table--container .model__table--wrapper .g-table__wrapper .fsm {\n  cursor: pointer;\n  color: var(--idooel-primary-color);\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined });
+    inject("data-v-46075027_0", { source: ".ele.model__tree-table[data-v-46075027] {\n  background: transparent;\n  display: flex;\n  flex-direction: row;\n  width: 100%;\n}\n.ele.model__tree-table .model__tree-table--container .model__tree--wrapper[data-v-46075027] {\n  width: 240px;\n  background: #fff;\n  flex-shrink: 0;\n  padding: 16px;\n  box-sizing: border-box;\n  margin-right: 16px;\n  overflow-y: auto;\n}\n.ele.model__tree-table .model__table--container[data-v-46075027] {\n  width: 100%;\n  min-width: 0;\n  background: #fff;\n}\n.ele.model__tree-table .model__table--container .model__table--title .model__table-title--bar[data-v-46075027] {\n  width: 100%;\n  height: 8px;\n  background: var(--idooel-primary-color);\n  border-top-left-radius: 4px;\n  border-top-right-radius: 4px;\n}\n.ele.model__tree-table .model__table--container .model__table--title .model__table-title--text[data-v-46075027] {\n  text-align: left;\n  padding: 16px;\n  font-size: 16px;\n  font-weight: bold;\n  background: #fff;\n  border-bottom: 1px solid;\n  border-color: var(--idoole-black-016);\n}\n.ele.model__tree-table .model__table--container .model__table--wrapper[data-v-46075027] {\n  background: #fff;\n}\n.ele.model__tree-table .model__table--container .model__table--wrapper .button-row__area[data-v-46075027] {\n  width: 100%;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n  padding-top: 16px;\n  padding-bottom: 8px;\n  padding-right: 16px;\n}\n.ele.model__tree-table .model__table--container .model__table--wrapper .g-table__wrapper .fsm[data-v-46075027] {\n  cursor: pointer;\n  color: var(--idooel-primary-color);\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["C:\\Users\\ZOU\\Code\\OnlineStudy\\base-elearning-frontend-model\\packages\\components\\packages\\models\\tree-table-model\\src\\index.vue","index.vue"],"names":[],"mappings":"AAiwBA;EACA,uBAAA;EACA,aAAA;EACA,mBAAA;EACA,WAAA;AChwBA;ADkwBA;EACA,YAAA;EACA,gBAAA;EACA,cAAA;EACA,aAAA;EACA,sBAAA;EACA,kBAAA;EACA,gBAAA;AChwBA;ADmwBA;EACA,WAAA;EACA,YAAA;EACA,gBAAA;ACjwBA;ADmwBA;EACA,WAAA;EACA,WAAA;EACA,uCAAA;EACA,2BAAA;EACA,4BAAA;ACjwBA;ADmwBA;EACA,gBAAA;EACA,aAAA;EACA,eAAA;EACA,iBAAA;EACA,gBAAA;EACA,wBAAA;EACA,qCAAA;ACjwBA;ADowBA;EACA,gBAAA;AClwBA;ADmwBA;EACA,WAAA;EACA,aAAA;EACA,mBAAA;EACA,mBAAA;EACA,8BAAA;EACA,iBAAA;EACA,mBAAA;EACA,mBAAA;ACjwBA;ADowBA;EACA,eAAA;EACA,kCAAA;AClwBA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["<template>\r\n  <section class=\"ele model__tree-table\">\r\n    <section class=\"model__tree-table--container\" v-if=\"showTree\">\r\n      <div class=\"model__tree--title\"></div>\r\n      <section :ref=\"modelTreeWrapper\" class=\"model__tree--wrapper\" :style=\"{height: `${treeWrapperHeight}px`}\">\r\n        <ele-tree\r\n          :tree-data=\"treeData\"\r\n          :defaultExpandedKeys=\"defaultExpandedKeys\"\r\n          :defaultSelectedKeys=\"defaultSelectedKeys\"\r\n          @select=\"selectTreeNode\"\r\n          :replace-fields=\"mapFields\">\r\n        </ele-tree>\r\n      </section>\r\n    </section>\r\n    <section class=\"model__table--container\" :ref=\"modelTableContainerRef\">\r\n      <div class=\"model__table--title\" v-if=\"title\">\r\n        <template v-if=\"titleMode\">\r\n          <div :class=\"[`model__table-title--${titleMode}`]\"></div>\r\n        </template>\r\n        <template v-else>\r\n          <div class=\"model__table-title--text\">{{ title }}</div>\r\n        </template>\r\n      </div>\r\n      <section :ref=\"modelTableWrapper\" class=\"model__table--wrapper\">\r\n        <ele-search-area :ref=\"searchArea\" @search=\"onSearch\" :data-source=\"searchMeta.elements\"></ele-search-area>\r\n        <div class=\"button-row__area\">\r\n          <ele-button-group class=\"model-table__button-group\" v-on=\"overrideButtonGroupEvent\" :ref=\"buttonGroup\" @click=\"handleClickButtonGroup\" :data-source=\"getButtonGroupElements\"></ele-button-group>\r\n          <slot name=\"tags\"></slot>\r\n          <slot v-if=\"$slots['sub-center']\" name=\"sub-center\"></slot>\r\n        </div>\r\n        <ele-table\r\n          v-on=\"overrideTableEvent\"\r\n          :ref=\"tableRef\"\r\n          :row-selection=\"rowSelection\"\r\n          :loading=\"loading\" \r\n          :columns=\"columns\"\r\n          :total=\"total\"\r\n          :x=\"x\"\r\n          :y=\"y\"\r\n          :bordered=\"setBorder\"\r\n          :height=\"tableHeight\"\r\n          :width=\"tableWidth\"\r\n          :actions=\"actions\"\r\n          :pageSize=\"pageSize\"\r\n          :pageSizeOptions=\"pageSizeOptions\"\r\n          :data-source=\"tableData\"\r\n          @change-page=\"onChangePage\"\r\n        ></ele-table>\r\n      </section>\r\n    </section>\r\n    <ele-modal-form v-model=\"modalFormValue\" v-on=\"overrideModalFormEvent\" :meta=\"modalFormMeta\"></ele-modal-form>\r\n    <ele-modal-fsm v-model=\"showFsmModal\" :contextProp=\"fsmContextProp\" :meta=\"fsmMeta\" @cancel=\"handleCloseFsmModal\"></ele-modal-fsm>\r\n    <ele-modal-table\r\n      :meta=\"modalTableMeta\"\r\n      v-model=\"modalTableValue\"\r\n      v-on=\"overrideModalTableEvent\"\r\n    ></ele-modal-table>\r\n  </section>\r\n</template>\r\n\r\n<script>\r\nimport { type, net } from '@idooel/shared'\r\nimport { v4 as uuidv4 } from 'uuid'\r\nimport { BUILT_IN_EVENT_NAMES, RESERVE_EVENT_NAMES, parseFieldMap, BUILT_IN_TRIGGER, CONTEXT } from '../../../utils'\r\nimport { createTreeTableModel } from '../../../utils/runtime-context'\r\nexport default {\r\n  name: 'ele-tree-table-model',\r\n  props: {\r\n    title: {\r\n      type: [Object, String]\r\n    },\r\n    overHeight: {\r\n      type: Number,\r\n      default: 0\r\n    },\r\n    treeMeta: {\r\n      type: Object,\r\n      default: () => ({})\r\n    },\r\n    searchMeta: {\r\n      type: Object,\r\n      default: () => ({})\r\n    },\r\n    buttonGroupMeta: {\r\n      typeof: Object,\r\n      default: () => ({})\r\n    },\r\n    tableMeta: {\r\n      type: Object,\r\n      default: () => ({})\r\n    },\r\n    createMeta: {\r\n      type: Object\r\n    },\r\n    editMeta: {\r\n      type: Object\r\n    }\r\n  },\r\n  provide () {\r\n    return {\r\n      requestTreeData: this.requestTreeData,\r\n      requestTableData: this.requestTableData,\r\n      keepAliveRefresh: this.keepAliveRefresh,\r\n      [CONTEXT]: () => {\r\n        return {\r\n          exposed: this.exposed\r\n        }\r\n      }\r\n    }\r\n  },\r\n  data () {\r\n    return {\r\n      tableHeight: 0,\r\n      tableWidth: 0,\r\n      modalFormMeta: {},\r\n      modalFormValue: false,\r\n      treeData: [],\r\n      tableData: [],\r\n      defaultExpandedKeys: [],\r\n      defaultSelectedKeys: [],\r\n      replaceFields: {\r\n        title: 'title',\r\n        children: 'children',\r\n        key: 'id'\r\n      },\r\n      loading: false,\r\n      total: 0,\r\n      tableQuerys: {},\r\n      resizeObserverModelTableWrapper: null,\r\n      modelTableWrapperHeight: 0,\r\n      currentTreeNodeData: {},\r\n      currentRowData: {},\r\n      treeWrapperHeight: 0,\r\n      currentTableSelection: this.currentTableMode == 'radio' ? {} : [],\r\n      showFsmModal: false,\r\n      fsmMeta: {},\r\n      fsmContextProp: {},\r\n      modalTableValue: false,\r\n      modalTableMeta: {},\r\n      dataPoolManager: null\r\n    }\r\n  },\r\n  computed: {\r\n    setBorder () {\r\n      return this.tableMeta.bordered === false ? false : true\r\n    },\r\n    rowSelection () {\r\n      if (!this.currentTableMode) return void 0\r\n      return {\r\n        columnTitle: this.currentSelectionColumn.columnTitle,\r\n        fixed: true,\r\n        type: this.currentTableMode,\r\n        onChange: this.onChangeTableSelection\r\n      }\r\n    },\r\n    currentSelectionColumn () {\r\n      const { multiple } = this.tableMeta\r\n      const target = this.columns.find(item => Object.keys(item).includes('multiple'))\r\n      const isGlobalExistMultiple = Object.keys(this.tableMeta).includes('multiple')\r\n      if (target) {\r\n        return target\r\n      } else if (isGlobalExistMultiple) {\r\n        return { multiple }\r\n      }\r\n      return void 0\r\n    },\r\n    x () {\r\n      const { x } = this.tableMeta\r\n      return x\r\n    },\r\n    y () {\r\n      const { y } = this.tableMeta\r\n      return y\r\n    },\r\n    currentTableMode () {\r\n      if (!this.currentSelectionColumn) return void 0\r\n      const { multiple } = this.currentSelectionColumn\r\n      if (type.isBool(multiple)) {\r\n        if (multiple) {\r\n          return 'checkbox'\r\n        } else {\r\n          return 'radio'\r\n        }\r\n      } else {\r\n        return void 0\r\n      }\r\n    },\r\n    modelTableContainerRef () {\r\n      return uuidv4()\r\n    },\r\n    titleMode () {\r\n      if (type.isObject(this.title)) {\r\n        const { mode = '' } = this.title\r\n        return mode\r\n      }\r\n      return void 0\r\n    },\r\n    tableRef () {\r\n      return uuidv4()\r\n    },\r\n    exposed () {\r\n      return {\r\n        showModalForm: this.showModalForm,\r\n        closeModalForm: this.closeModalForm,\r\n        showModalTable: this.showModalTable,\r\n        closeModalTable: this.closeModalTable,\r\n        currentTableSelection: this.currentTableSelection,\r\n        currentTreeNode: this.currentTreeNodeData,\r\n        requestTableData: this.requestTableData,\r\n        keepAliveRefresh: this.keepAliveRefresh,\r\n        refreshTreeData: this.refreshTreeData,\r\n        querys: this.tableQuerys,\r\n        currentRowData: this.getCurrentRowData(),\r\n        getCurrentRowData: this.getCurrentRowData,\r\n        setCurrentRowData: this.setCurrentRowData,\r\n        setCurrentTableSelection: this.setCurrentTableSelection,\r\n        getCurrentTableSelection: this.getCurrentTableSelection,\r\n        cleanCurrentModelEffect: this.cleanCurrentModelEffect,\r\n        route: this.$route,\r\n        _route: this.$route.query,\r\n        _routeMeta: this.$route.meta,\r\n        dataPool: this.model ? this.model.getDataPool() : null,\r\n        dataPoolManager: this.model || null\r\n      }\r\n    },\r\n    overrideTableEvent () {\r\n      const events = this.actions.reduce((ret, action) => {\r\n        ret[action.eventName || action.key] = (e) => {\r\n          this.setCurrentRowData(e.exposed.currentRowData)\r\n          const { target } = action\r\n          const targetMeta = this.findMetaByKey(target)\r\n          const { mode } = targetMeta\r\n          mode && this.dispatchTrigger({ mode, record: e.exposed.currentRowData, modeMeta: targetMeta })\r\n          this.$emit(action.eventName || action.key, { ...e, currentTreeNode: this.currentTreeNodeData, exposed: { ...this.exposed, ...e.exposed } })\r\n        }\r\n        return ret\r\n      }, {})\r\n      return {\r\n        ...this.$listeners,\r\n        ...events,\r\n        [BUILT_IN_EVENT_NAMES.EDIT]: this[BUILT_IN_EVENT_NAMES.EDIT],\r\n        [BUILT_IN_EVENT_NAMES.SUBMIT]: this[BUILT_IN_EVENT_NAMES.SUBMIT]\r\n      }\r\n    },\r\n    overrideModalFormEvent () {\r\n      const { footerMeta } = this.modalFormMeta\r\n      const { elements = [] } = footerMeta || {}\r\n      const eles = type.isFunction(elements) ? elements.call(this) : elements\r\n      const events = eles.reduce((ret, ele) => {\r\n        ret[ele.eventName] = (e = {}) => {\r\n          if (ele.eventName === 'cancel') {\r\n            this.closeModalForm()\r\n          } else {\r\n            const { exposed = {} } = e\r\n            this.$emit(`${ele.eventName || ele.key}`, { ...e, currentTreeNode: this.currentTreeNodeData, exposed: Object.assign({}, exposed )})\r\n          }\r\n        }\r\n        return ret\r\n      }, {})\r\n      return {\r\n        ...events\r\n      }\r\n    },\r\n    overrideModalTableEvent () {\r\n      const { footerMeta } = this.modalTableMeta\r\n      const { elements = [] } = footerMeta || {}\r\n      const eles = type.isFunction(elements) ? elements.call(this) : elements\r\n      const events = eles.reduce((ret, ele) => {\r\n        ret[ele.eventName] = (e = {}) => {\r\n          if (ele.eventName === 'cancel') {\r\n            this.closeModalTable()\r\n          } else {\r\n            const { exposed = {} } = e\r\n            this.$emit(`${ele.eventName || ele.key}`, { ...e, currentTreeNode: this.currentTreeNodeData, exposed: Object.assign({}, exposed )})\r\n          }\r\n        }\r\n        return ret\r\n      }, {})\r\n      return {\r\n        ...events,\r\n        exposed: this.exposed\r\n      }\r\n    },\r\n    overrideButtonGroupEvent () {\r\n      const events = this.getButtonGroupElements.reduce((ret, ele) => {\r\n        ret[ele.eventName] = (e) => {\r\n          this.$emit(ele.eventName || 'click', { ...e, currentTreeNode: this.currentTreeNodeData, exposed: Object.assign({}, e.exposed || {}, this.exposed)})\r\n        }\r\n        return ret\r\n      }, {})\r\n      return {\r\n        ...this.$listeners,\r\n        ...events,\r\n        [BUILT_IN_EVENT_NAMES.CREATE]: this[BUILT_IN_EVENT_NAMES.CREATE],\r\n        exposed: this.exposed\r\n      }\r\n    },\r\n    showTree () {\r\n      return !!Object.keys(this.treeMeta).length\r\n    },\r\n    buttonGroup () {\r\n      return uuidv4()\r\n    },\r\n    searchArea () {\r\n      return uuidv4()\r\n    },\r\n    modelTreeWrapper () {\r\n      return uuidv4()\r\n    },\r\n    modelTableWrapper () {\r\n      return uuidv4()\r\n    },\r\n    actions () {\r\n      const { operations } = this.tableMeta\r\n      if (operations) {\r\n        return operations.elements\r\n      } else {\r\n        return []\r\n      }\r\n    },\r\n    pageSize () {\r\n      const { page = {} } = this.tableMeta\r\n      return page.pageSize || 10\r\n    },\r\n    pageSizeOptions () {\r\n      const { page = {} } = this.tableMeta\r\n      return page.pageSizeOptions || ['10', '20', '30', '40']\r\n    },\r\n    columns () {\r\n      const { columns, operations } = this.tableMeta\r\n      if (type.get(columns) === 'array') {\r\n        const columnsOptions = columns.map(item => {\r\n          const { mode = 'text' } = item\r\n          if (item.render) {\r\n            return {\r\n              ...item,\r\n              customRender: (text, record, index) => {\r\n                const { $createElement } = this\r\n                return item.render.call(this, \r\n                  { h: $createElement, ctx: this },\r\n                  text ? typeof text == 'object' ? text[item.dataIndex] : text : '', \r\n                  record, index)\r\n              }\r\n            }\r\n          } else if (mode !== BUILT_IN_TRIGGER.TEXT) {\r\n            const { [`${mode}Meta`]: modeMeta } = item\r\n            return {\r\n              ...item,\r\n              customRender: (text, record, index) => {\r\n                return <span onClick={() => this.dispatchTrigger({ mode, record, modeMeta, index })} class={ mode }>{ text }</span>\r\n              }\r\n            }\r\n          }\r\n          return {\r\n            ...item\r\n          }\r\n        })\r\n        if (operations) {\r\n          return [\r\n            ...columnsOptions,\r\n            {\r\n              title: '操作',\r\n              width: operations.width,\r\n              key: 'action',\r\n              fixed: 'right',\r\n              scopedSlots: { customRender: 'action' }\r\n            }\r\n          ]\r\n        }\r\n        return columnsOptions\r\n      } else {\r\n        console.error('Error: columns is invalid, please check it')\r\n        return []\r\n      }\r\n    },\r\n    getButtonGroupElements () {\r\n      const { elements } = this.buttonGroupMeta\r\n      if (type.get(elements) === 'function') {\r\n        return elements.call(this)\r\n      } else if (type.get(elements) === 'array') {\r\n        return elements\r\n      } else {\r\n        return []\r\n      }\r\n    },\r\n    mapFields () {\r\n      const { replaceFields = {} } = this.treeMeta\r\n      const mapFields = type.isEmpty(replaceFields) ? this.replaceFields : replaceFields\r\n      return mapFields\r\n    }\r\n  },\r\n  async created () {\r\n    // onSearch会初始化请求表格数据，所以不需要在这里请求表格数据\r\n    // 确保全局数据池已初始化\r\n    if (!window.__idooel_data_pool__) {\r\n      console.error('Global data pool not initialized. Please check if runtime-context/globalDataPool.js is properly imported.')\r\n      return\r\n    }\r\n    \r\n    // 初始化数据池管理器（使用新的 runtime-context）\r\n    try {\r\n      this.model = createTreeTableModel('treeTableModel')\r\n      \r\n      if (!this.model) {\r\n        throw new Error('Failed to create tree table model')\r\n      }\r\n    } catch (error) {\r\n      console.error('Error creating tree table model:', error)\r\n      this.model = null\r\n      return\r\n    }\r\n    \r\n    // 初始化 currentRowData（尝试从共享命名空间获取）\r\n    this.initializeCurrentRowData()\r\n    \r\n    // 订阅数据池变化\r\n    this.unsubscribe = this.model.subscribe('currentRowData', (event) => {\r\n      this.currentRowData = event.value || {}\r\n      this.$forceUpdate()\r\n    })\r\n    \r\n    // 订阅共享数据变化\r\n    this.unsubscribeShared = this.model.subscribeShared((event) => {\r\n      // 当有新的共享数据时，更新当前组件的 currentRowData\r\n      if (event.value && Object.keys(event.value).length > 0) {\r\n        this.setCurrentRowData(event.value)\r\n      }\r\n    })\r\n    \r\n    if (this.showTree) {\r\n      this.treeData = await this.requestTreeData()\r\n      const [defaultTreeNode = {}] = this.treeData\r\n      this.defaultExpandedKeys = [defaultTreeNode[this.mapFields.key]]\r\n      this.defaultSelectedKeys = [defaultTreeNode[this.mapFields.key]]\r\n      this.currentTreeNodeData = defaultTreeNode\r\n      const { params = {}, fieldMap = {}, overrideInit = false } = this.tableMeta\r\n      const currentRowData = this.getCurrentRowData()\r\n      const ctx = { \r\n        ...this.currentTreeNodeData, \r\n        _route: this.$route.query, \r\n        currentRowData: currentRowData\r\n      }\r\n      \r\n      const initQuerys = Object.assign({}, params, parseFieldMap(fieldMap, ctx))\r\n      if (overrideInit) {\r\n        this.$emit(RESERVE_EVENT_NAMES.INIT, { ...this.exposed })\r\n      } else {\r\n        this.tableData = await this.requestTableData(initQuerys)\r\n      }\r\n    }\r\n  },\r\n  methods: {\r\n    initializeCurrentRowData () {\r\n      if (!this.model) {\r\n        console.warn('Model not initialized, skipping currentRowData initialization')\r\n        return\r\n      }\r\n      \r\n      // 检查是否有来自父组件的共享数据（比如 modal table 场景）\r\n      const parentData = this.model.getSharedData()\r\n      \r\n      if (parentData && Object.keys(parentData).length > 0) {\r\n        this.setCurrentRowData(parentData)\r\n        return\r\n      }\r\n      \r\n      // 可以根据路由参数、props 或其他来源设置初始的 currentRowData\r\n      const { query } = this.$route\r\n      \r\n      // 示例：如果路由中有特定参数，可以设置为 currentRowData\r\n      if (query.rowId || query.selectedId) {\r\n        // 这里可以根据实际需求从服务端或其他地方获取数据\r\n        // const presetData = { id: query.rowId, /* 其他字段 */ }\r\n        // this.setCurrentRowData(presetData)\r\n      }\r\n      \r\n      // 目前保持空对象，等待用户选择行数据\r\n    },\r\n    async refreshTreeData () {\r\n      this.treeData = await this.requestTreeData()\r\n      const [defaultTreeNode = {}] = this.treeData\r\n      this.defaultExpandedKeys = [defaultTreeNode[this.mapFields.key]]\r\n      this.defaultSelectedKeys = [defaultTreeNode[this.mapFields.key]]\r\n      this.currentTreeNodeData = defaultTreeNode\r\n    },\r\n    dispatchTrigger ({ mode, record = {}, modeMeta = { } }) {\r\n      switch (mode) {\r\n        case BUILT_IN_TRIGGER.FSM:\r\n          this[`${BUILT_IN_TRIGGER.FSM}Trigger`](record, modeMeta = type.isEmpty(modeMeta) ? { \r\n            url: 'api-fsm/workbench/fsm/auditFlow',\r\n            requestType: 'GET',\r\n            fieldMap: {\r\n              modelCode: 'modelCode',\r\n              businessId: 'businessId'\r\n            }\r\n          } : modeMeta)\r\n          break\r\n        case BUILT_IN_TRIGGER.ELE_MODAL_FORM:\r\n          this.modalFormMeta = modeMeta\r\n          this.showModalForm(modeMeta)\r\n          break\r\n        case BUILT_IN_TRIGGER.ELE_MODAL_TABLE:\r\n          this.modalTableMeta = modeMeta\r\n          // 将当前行的 record 数据传递给 modal table\r\n          this.showModalTable(modeMeta, record)\r\n          break\r\n        default:\r\n          break\r\n      }\r\n    },\r\n    handleCloseFsmModal () {\r\n      this.showFsmModal = false\r\n    },\r\n    [`${BUILT_IN_TRIGGER.FSM}Trigger`] (record, meta) {\r\n      this.fsmMeta = meta\r\n      this.fsmContextProp = record\r\n      this.showFsmModal = true\r\n    },\r\n    onChangeTableSelection (_, selectedRows = []) {\r\n      if (this.currentTableMode === 'radio') {\r\n        this.setCurrentTableSelection(selectedRows)\r\n        this.$emit('on-change-table-selection', this.currentTableSelection)\r\n        this.$emit('x:refresh-exposed', { exposed: this.exposed })\r\n      } else {\r\n        this.setCurrentTableSelection(selectedRows)\r\n        this.$emit('on-change-table-selection', this.currentTableSelection)\r\n        this.$emit('x:refresh-exposed', { exposed: this.exposed })\r\n      }\r\n    },\r\n    setCurrentTableSelection (props = {}) {\r\n      if (this.currentTableMode === 'radio') {\r\n        this.$set(this, 'currentTableSelection', (type.isArray(props) && props.length > 0) ? props[0] : type.isObject(props) ? props : {})\r\n      } else {\r\n        this.$set(this, 'currentTableSelection', type.isArray(props) ? props : [])\r\n      }\r\n    },\r\n    getCurrentTableSelection () {\r\n      return this.currentTableSelection\r\n    },\r\n    setCurrentRowData (props = {}) {\r\n      this.currentRowData = props\r\n      if (this.model) {\r\n        this.model.setCurrentRowData(props)\r\n      } else {\r\n        console.warn('Model not initialized, cannot setCurrentRowData in model')\r\n      }\r\n    },\r\n    getCurrentRowData () {\r\n      if (this.model) {\r\n        return this.model.getCurrentRowData()\r\n      }\r\n      console.warn('Model not initialized, getCurrentRowData returning local data')\r\n      return this.currentRowData || {}\r\n    },\r\n    cleanCurrentModelEffect (clearRowData = true) {\r\n      this.setCurrentTableSelection()\r\n      if (clearRowData) {\r\n        this.setCurrentRowData({})\r\n      }\r\n    },\r\n    [BUILT_IN_EVENT_NAMES.SUBMIT] (props = {}) {\r\n      this.cleanCurrentModelEffect()\r\n      this.requestTableData()\r\n    },\r\n    [BUILT_IN_EVENT_NAMES.EDIT] (props = {}) {\r\n      const { record = {} } = props\r\n      this.setCurrentRowData(record)\r\n      this.modalFormMeta = this.editMeta\r\n      this.modalFormValue = true\r\n    },\r\n    [BUILT_IN_EVENT_NAMES.CREATE] () {\r\n      this.modalFormMeta = this.createMeta\r\n      this.modalFormValue = true\r\n    },\r\n    showModalForm (modeMeta = {}) {\r\n      if (type.isStr(modeMeta)) {\r\n        const targetMeta = this.findMetaByKey(modeMeta)\r\n        this.modalFormMeta = targetMeta\r\n      } else {\r\n        this.modalFormMeta = modeMeta\r\n      }\r\n      this.modalFormValue = true\r\n    },\r\n    showModalTable (modeMeta = {}, record = null) {\r\n      // 获取当前行数据并设置到共享命名空间\r\n      const currentRowData = record || this.getCurrentRowData()\r\n      if (this.model) {\r\n        this.model.setSharedData(currentRowData)\r\n      } else {\r\n        console.warn('Model not initialized, cannot setSharedData')\r\n      }\r\n      \r\n      let targetMeta = modeMeta\r\n      if (type.isStr(modeMeta)) {\r\n        targetMeta = this.findMetaByKey(modeMeta)\r\n      }\r\n      \r\n      // 解析 fieldMap 参数，使用完整的上下文包括 currentRowData\r\n      if (targetMeta && targetMeta.fieldMap) {\r\n        const { fieldMap, params = {} } = targetMeta\r\n        \r\n        const ctx = { \r\n          ...this.currentTreeNodeData, \r\n          _route: this.$route.query, \r\n          ...currentRowData \r\n        }\r\n        const parsedParams = parseFieldMap(fieldMap, ctx)\r\n        \r\n        // 将当前的 currentRowData 传递给 modal table，通过 params\r\n        targetMeta = {\r\n          ...targetMeta,\r\n          params: {\r\n            ...params,\r\n            ...parsedParams\r\n          }\r\n        }\r\n      }\r\n      \r\n      this.modalTableMeta = targetMeta\r\n      this.modalTableValue = true\r\n    },\r\n    closeModalForm () {\r\n      this.modalFormValue = false\r\n    },\r\n    closeModalTable () {\r\n      this.modalTableValue = false\r\n    },\r\n    findMetaByKey (key) {\r\n      return this.$attrs[key] || {}\r\n    },\r\n    handleClickButtonGroup (props) {\r\n      const { eventName, target } = props\r\n      const targetMeta = this.findMetaByKey(target)\r\n      const { mode } = targetMeta\r\n      mode && this.dispatchTrigger({ mode, modeMeta: targetMeta })\r\n      this.$emit(eventName || 'click', { currentTreeNode: this.currentTreeNodeData })\r\n    },\r\n    async onSearch (props) {\r\n      const { overrideInit = false } = this.tableMeta\r\n      this.tableQuerys = Object.assign(this.tableQuerys, props)\r\n      if (overrideInit) {\r\n        this.$emit(RESERVE_EVENT_NAMES.TREE_CHANGE, { ...this.exposed })\r\n      } else {\r\n        const { initSearch = false } = props\r\n        if (this.showTree && initSearch) return\r\n        this.tableData = await this.requestTableData()\r\n      }\r\n    },\r\n    async selectTreeNode (selectedKeys, e) {\r\n      const { fieldMap } = this.tableMeta\r\n      this.currentTreeNodeData = e.node.$vnode.data.props.dataRef || {}\r\n      //@deprecated '_' namespace is deprecated, please use 'exposed' instead\r\n      const execFieldMapRet = parseFieldMap(fieldMap, { ...this.currentTreeNodeData, exposed: this.exposed, _route: this.exposed._route })\r\n      const { overrideInit = false } = this.tableMeta\r\n      if (overrideInit) {\r\n        this.$emit(RESERVE_EVENT_NAMES.TREE_CHANGE, { ...this.exposed })\r\n      } else {\r\n        this.tableData = await this.requestTableData(execFieldMapRet)\r\n      }\r\n    },\r\n    async requestTreeData () {\r\n      const { url, requestType = 'GET', params = {}, fieldMap = {} } = this.treeMeta\r\n      const fieldMapRet = parseFieldMap(fieldMap, { ...this.currentTreeNodeData, _route: this.$route.query })\r\n      const ret = await net[requestType.toLowerCase()](\r\n        url,\r\n        { ...params, ...fieldMapRet }\r\n      ).then(resp => {\r\n        const { data } = resp || {}\r\n        return data\r\n      })\r\n      return ret\r\n    },\r\n    async onChangePage (page, pageSize) {\r\n      this.tableData = await this.requestTableData({ currentPage: page, pageSize })\r\n    },\r\n    async requestTableData (props = {}) {\r\n      const { url, requestType = 'GET', page = {} } = this.tableMeta\r\n      this.tableQuerys = Object.assign(this.tableQuerys, { currentPage: this.tableQuerys.currentPage || 1, pageSize: this.tableQuerys.pageSize || 10 }, props)\r\n      this.$emit(RESERVE_EVENT_NAMES.WATCH, { ...this.exposed })\r\n      this.loading = true\r\n      const ret = await net[requestType.toLowerCase()](\r\n        url,\r\n        this.tableQuerys\r\n      ).then(resp => {\r\n        const { data = [], count } = resp || {}\r\n        this.total = count\r\n        this.loading = false\r\n        return (data || []).map(item => {\r\n          delete item.children\r\n          return {\r\n            key: uuidv4(),\r\n            ...item\r\n          }\r\n        })\r\n      })\r\n      this.cleanCurrentModelEffect(false) // 不清空 currentRowData，除非明确需要\r\n      this.tableData = ret\r\n      return ret\r\n    },\r\n    calculateTableHeight () {\r\n      const currentViewportHeight = window.innerHeight\r\n      const tableRef = this.$refs[this.tableRef]\r\n      const { top: tableToTop, width } = tableRef.$el.getBoundingClientRect()\r\n      this.tableWidth = width\r\n      this.tableHeight = currentViewportHeight - tableToTop - this.overHeight\r\n    },\r\n    calculateTreeHeight () {\r\n      if (!this.showTree) return\r\n      const modelTableContainerRef = this.$refs[this.modelTableContainerRef]\r\n      const { height } = modelTableContainerRef.getBoundingClientRect()\r\n      this.treeWrapperHeight = height\r\n    },\r\n    async keepAliveRefresh () {\r\n      // 重新计算表格高度（应对窗口大小变化）\r\n      this.$nextTick(() => {\r\n        this.calculateTableHeight()\r\n        if (this.showTree) {\r\n          this.calculateTreeHeight()\r\n        }\r\n      })\r\n      // 刷新列表数据\r\n      const { overrideInit = false } = this.tableMeta\r\n      if (overrideInit) {\r\n        // 如果使用自定义初始化模式，触发 INIT 事件\r\n        this.$emit(RESERVE_EVENT_NAMES.INIT, { ...this.exposed })\r\n      } else {\r\n        // 使用当前查询参数刷新表格数据\r\n        await this.requestTableData(this.tableQuerys)\r\n      }\r\n    }\r\n  },\r\n  mounted () {\r\n    this.calculateTableHeight()\r\n    this.$nextTick(() => {\r\n      this.calculateTreeHeight()\r\n    })\r\n    this.resizeObserverModelTableWrapper = new ResizeObserver(entries => {\r\n      for (const _ of entries) {\r\n        requestAnimationFrame(() => {\r\n          this.calculateTableHeight()\r\n        })\r\n      }\r\n    })\r\n    this.resizeObserverModelTableWrapper.observe(this.$refs[this.modelTableWrapper])\r\n  },\r\n  destroyed () {\r\n    this.resizeObserverModelTableWrapper.disconnect()\r\n    if (this.model) {\r\n      // 清理订阅\r\n      if (this.unsubscribe) {\r\n        this.unsubscribe()\r\n      }\r\n      if (this.unsubscribeShared) {\r\n        this.unsubscribeShared()\r\n      }\r\n      // 清理模型数据\r\n      if (this.model) {\r\n        this.model.cleanup()\r\n      }\r\n    }\r\n  },\r\n  async activated () {\r\n    await this.keepAliveRefresh()\r\n  }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.ele {\r\n  &.model__tree-table {\r\n    background: transparent;                                                                                                                                                                                                                 \r\n    display: flex;\r\n    flex-direction: row;\r\n    width: 100%;\r\n    .model__tree-table--container {\r\n      .model__tree--wrapper {\r\n        width: 240px;\r\n        background: #fff;\r\n        flex-shrink: 0;\r\n        padding: 16px;\r\n        box-sizing: border-box;\r\n        margin-right: 16px;\r\n        overflow-y: auto;\r\n      }\r\n    }\r\n    .model__table--container {\r\n      width: 100%;\r\n      min-width: 0;\r\n      background: #fff;\r\n      .model__table--title {\r\n        .model__table-title--bar {\r\n          width: 100%;\r\n          height: 8px;\r\n          background: var(--idooel-primary-color);\r\n          border-top-left-radius: 4px;\r\n          border-top-right-radius: 4px;\r\n        }\r\n        .model__table-title--text {\r\n          text-align: left;\r\n          padding: 16px;\r\n          font-size: 16px;\r\n          font-weight: bold;\r\n          background: #fff;\r\n          border-bottom: 1px solid;\r\n          border-color: var(--idoole-black-016);\r\n        }\r\n      }\r\n      .model__table--wrapper {\r\n        background: #fff;\r\n        .button-row__area {\r\n          width: 100%;\r\n          display: flex;\r\n          flex-direction: row;\r\n          align-items: center;\r\n          justify-content: space-between;\r\n          padding-top: 16px;\r\n          padding-bottom: 8px;\r\n          padding-right: 16px;\r\n        }\r\n        .g-table__wrapper {\r\n          .fsm {\r\n            cursor: pointer;\r\n            color: var(--idooel-primary-color);\r\n          }\r\n        }\r\n      }\r\n    }\r\n  }\r\n}\r\n</style>\r\n",".ele.model__tree-table {\n  background: transparent;\n  display: flex;\n  flex-direction: row;\n  width: 100%;\n}\n.ele.model__tree-table .model__tree-table--container .model__tree--wrapper {\n  width: 240px;\n  background: #fff;\n  flex-shrink: 0;\n  padding: 16px;\n  box-sizing: border-box;\n  margin-right: 16px;\n  overflow-y: auto;\n}\n.ele.model__tree-table .model__table--container {\n  width: 100%;\n  min-width: 0;\n  background: #fff;\n}\n.ele.model__tree-table .model__table--container .model__table--title .model__table-title--bar {\n  width: 100%;\n  height: 8px;\n  background: var(--idooel-primary-color);\n  border-top-left-radius: 4px;\n  border-top-right-radius: 4px;\n}\n.ele.model__tree-table .model__table--container .model__table--title .model__table-title--text {\n  text-align: left;\n  padding: 16px;\n  font-size: 16px;\n  font-weight: bold;\n  background: #fff;\n  border-bottom: 1px solid;\n  border-color: var(--idoole-black-016);\n}\n.ele.model__tree-table .model__table--container .model__table--wrapper {\n  background: #fff;\n}\n.ele.model__tree-table .model__table--container .model__table--wrapper .button-row__area {\n  width: 100%;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n  padding-top: 16px;\n  padding-bottom: 8px;\n  padding-right: 16px;\n}\n.ele.model__tree-table .model__table--container .model__table--wrapper .g-table__wrapper .fsm {\n  cursor: pointer;\n  color: var(--idooel-primary-color);\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined });
 
   };
   /* scoped */
-  const __vue_scope_id__$A = "data-v-6e8ad2fe";
+  const __vue_scope_id__$A = "data-v-46075027";
   /* module identifier */
   const __vue_module_identifier__$A = undefined;
   /* functional template */
@@ -12917,7 +12920,10 @@ var script$b = {
   },
   created() {
     const querys = this.extractValues();
-    this.$emit('search', querys);
+    this.$emit('search', {
+      ...querys,
+      initSearch: true
+    });
   },
   methods: {
     controlDisplayByFormula(dataSource = []) {
@@ -13240,11 +13246,11 @@ __vue_render__$b._withStripped = true;
   /* style */
   const __vue_inject_styles__$b = function (inject) {
     if (!inject) return
-    inject("data-v-77b7e5ba_0", { source: ".search-area__wrapper[data-v-77b7e5ba] {\n  padding-top: 16px;\n  padding-left: 16px;\n  padding-right: 16px;\n}\n.search-area__wrapper[data-v-77b7e5ba]  .ant-col:last-child {\n  float: right;\n}\n.search-area__wrapper .search-area__item[data-v-77b7e5ba] {\n  height: 32px;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n}\n.search-area__wrapper .search-area__item.search-area--action[data-v-77b7e5ba] {\n  justify-content: end;\n}\n.search-area__wrapper .search-area__item .expand-collapse[data-v-77b7e5ba] {\n  margin-left: 8px;\n  height: 32px;\n  padding: 4px 16px;\n  color: var(--idooel-primary-color);\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n}\n.search-area__wrapper .search-area__item .expand-collapse .expand-collapse__text[data-v-77b7e5ba] {\n  font-size: 14px;\n}\n.search-area__wrapper .search-area__item .expand-collapse .expand-collapse__icon[data-v-77b7e5ba] {\n  font-size: 16px;\n  margin-left: 8px;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["C:\\Users\\ZOU\\Code\\OnlineStudy\\base-elearning-frontend-model\\packages\\components\\packages\\composite-components\\search-area\\src\\index.vue","index.vue"],"names":[],"mappings":"AAyMA;EACA,iBAAA;EACA,kBAAA;EACA,mBAAA;ACxMA;AD0MA;EACA,YAAA;ACxMA;AD2MA;EACA,YAAA;EACA,aAAA;EACA,mBAAA;EACA,mBAAA;ACzMA;AD0MA;EACA,oBAAA;ACxMA;AD0MA;EACA,gBAAA;EACA,YAAA;EACA,iBAAA;EACA,kCAAA;EACA,aAAA;EACA,mBAAA;EACA,mBAAA;EACA,uBAAA;EACA,eAAA;ACxMA;ADyMA;EACA,eAAA;ACvMA;ADyMA;EACA,eAAA;EACA,gBAAA;ACvMA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["<template>\r\n  <div class=\"search-area__wrapper\">\r\n    <a-row :gutter=\"gutter\">\r\n      <template v-for=\"(item, idx) in innerDataSource\">\r\n        <a-col v-if=\"item._show\" :span=\"item.span || span\" :key=\"idx\">\r\n          <div v-if=\"item.type == '_action'\" class=\"search-area__item search-area--action\">\r\n            <ele-button icon=\"search\" type=\"primary\" @click=\"handleClickSearch\">查询</ele-button>\r\n            <ele-button style=\"margin-left:8px;\" icon=\"reload\" @click=\"handleClickReset\">重置</ele-button>\r\n            <div v-if=\"innerDataSource.length > cuttingFormula + 1\" class=\"expand-collapse\" @click=\"handleClickExpandCollapse\">\r\n              <span class=\"expand-collapse__text\">{{ isExpand ? '收起' : '展开' }}</span>\r\n              <span class=\"expand-collapse__icon\">\r\n                <a-icon v-if=\"isExpand\" type=\"up\" />\r\n                <a-icon v-else type=\"down\" />\r\n              </span>\r\n            </div>\r\n          </div>\r\n          <div v-else class=\"search-area__item\">\r\n            <template v-if=\"(item.type == 'ele-input') || (item.type == 'Input')\">\r\n              <Label :label=\"item.label\"></Label>\r\n              <ele-input v-model=\"item._value\"></ele-input>\r\n            </template>\r\n            <template v-else-if=\"(item.type == 'ele-select') || (item.type == 'Select')\">\r\n              <Label :label=\"item.label\"></Label>\r\n              <ele-select v-model=\"item._value\" :init=\"item.init\" :mode=\"item.mode\" :code=\"item.code\" :params=\"item.params\" :url=\"item.url\" :multiple=\"item.multiple\" :data-source=\"item.optionList\"></ele-select>\r\n            </template>\r\n            <template v-else-if=\"(item.type == 'ele-date') || (item.type == 'DatePicker')\">\r\n              <Label :label=\"item.label\"></Label>\r\n              <ele-date v-model=\"item._value\" :placeholder=\"item.placeholder\" :format=\"item.format\"></ele-date>\r\n            </template>\r\n            <template v-else-if=\"item.type == 'ele-date-range'\">\r\n              <Label :label=\"item.label\"></Label>\r\n              <ele-date-range v-model=\"item._value\" :format=\"item.format\" :show-time=\"item.showTime\"></ele-date-range>\r\n            </template>\r\n          </div>\r\n        </a-col>\r\n      </template>\r\n    </a-row>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport Label from './label.vue'\r\nimport moment from 'moment'\r\nimport { parse } from '@idooel/expression'\r\nimport { type } from '@idooel/shared'\r\nexport default {\r\n  name: 'ele-search-area',\r\n  components: {\r\n    Label\r\n  },\r\n  props: {\r\n    gutter: {\r\n      type: [Number, Array, Object],\r\n      default: () => ([\r\n        16, 8\r\n      ])\r\n    },\r\n    span: {\r\n      type: Number,\r\n      default: 8\r\n    },\r\n    dataSource: {\r\n      type: Array,\r\n      required: true\r\n    }\r\n  },\r\n  data() {\r\n    return {\r\n      isExpand: false\r\n    }\r\n  },\r\n  computed: {\r\n    cuttingFormula () {\r\n      return (24 / this.span - 1)\r\n    },\r\n    buildDataSource () {\r\n      return this.controlDisplayByFormula(this.mapDefaultValueToValue())\r\n    },\r\n    innerDataSource () {\r\n      return [ ...this.buildDataSource, { type: '_action', _show: true }]\r\n    }\r\n  },\r\n  created() {\r\n    const querys = this.extractValues()\r\n    this.$emit('search', querys)\r\n  },\r\n  methods: {\r\n    controlDisplayByFormula (dataSource = []) {\r\n      if (this.isExpand) {\r\n        dataSource.forEach(item => {\r\n          this.$set(item, '_show', true)\r\n        })\r\n      } else {\r\n        dataSource.forEach((item, idx) => {\r\n          if (idx < this.cuttingFormula) {\r\n            this.$set(item, '_show', true)\r\n          } else {\r\n            this.$set(item, '_show', false)\r\n          }\r\n        })\r\n      }\r\n      return dataSource\r\n    },\r\n    buildDefaultValue (arg) {\r\n      if (type.isFunction(arg)) return arg.call(this)\r\n      if (type.notStr(arg)) return arg\r\n      if (!arg || arg.charAt(0) !== '_') return arg\r\n      return parse(arg, {\r\n        _route: this.$route.query\r\n      })\r\n    },\r\n    mapDefaultValueToValue () {\r\n      this.dataSource.forEach(props => {\r\n        this.$set(props, '_show', this.isExpand)\r\n        if (props.defaultValue) {\r\n          if (type.isFunction(props.defaultValue)) {\r\n            const ret = props.defaultValue.call(this)\r\n            this.$set(props, '_value', this.buildDefaultValue(ret))\r\n          } else {\r\n            this.$set(props, '_value', this.buildDefaultValue(props.defaultValue))\r\n          }\r\n        }\r\n      })\r\n      return this.dataSource\r\n    },\r\n    handleClickExpandCollapse () {\r\n      this.isExpand = !this.isExpand\r\n    },\r\n    handleClickSearch () {\r\n      const querys = this.extractValues()\r\n      this.$emit('search', querys)\r\n    },\r\n    buildMapto (mapTo = [], dataSource) {\r\n      const [ startField, endField ] = mapTo\r\n      const [ startValue, endValue ] = dataSource || [null, null]\r\n      return {\r\n        [startField]: startValue,\r\n        [endField]: endValue\r\n      }\r\n    },\r\n    extractValues () {\r\n      let ret = {}\r\n      this.innerDataSource.filter(item => item.type !== '_action').forEach(item => {\r\n        switch (item.type) {\r\n          case 'DatePicker':\r\n            ret[item.name] = typeof item._value == 'undefined' ? undefined : moment(item._value).format(item.format)\r\n            break\r\n          case 'ele-date-range':\r\n            if (item.mapTo) {\r\n              Object.assign(ret, this.buildMapto(item.mapTo, item._value))\r\n            } else {\r\n              ret[item.name] = (item._value || []).join(',')\r\n            }\r\n            break\r\n          default:\r\n            ret[item.name] = item._value\r\n            break\r\n        }\r\n      })\r\n      return ret\r\n    },\r\n    cleanValues () {\r\n      this.innerDataSource.filter(item => item.type !== '_action').forEach(item => {\r\n        const { defaultValue } = item\r\n        switch (item.type) {\r\n          case 'Select':\r\n            defaultValue && this.$set(item, '_value', this.buildDefaultValue(defaultValue))\r\n            !defaultValue && this.$set(item, '_value', null)\r\n            break\r\n          case 'DatePicker':\r\n            defaultValue && this.$set(item, '_value', this.buildDefaultValue(defaultValue))\r\n            !defaultValue && this.$set(item, '_value', undefined)\r\n            break\r\n          case 'ele-date-range':\r\n            defaultValue && this.$set(item, '_value', this.buildDefaultValue(defaultValue))\r\n            !defaultValue && this.$set(item, '_value', [])\r\n            break\r\n          default:\r\n            defaultValue && this.$set(item, '_value', this.buildDefaultValue(defaultValue))\r\n            !defaultValue && this.$set(item, '_value', null)\r\n            break\r\n        }\r\n      })\r\n    },\r\n    handleClickReset () {\r\n      this.cleanValues()\r\n      //TODO defaultValue\r\n      const querys = this.extractValues()\r\n      this.$emit('search', querys)\r\n    },\r\n    onChangeSelect (value, props) {\r\n      this.$set(props, '_value', value)\r\n    }\r\n  },\r\n  destroyed () {\r\n    this.cleanValues()\r\n  }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.search-area__wrapper {\r\n  padding-top: 16px;\r\n  padding-left: 16px;\r\n  padding-right: 16px;\r\n  ::v-deep .ant-col {\r\n    &:last-child {\r\n      float: right;\r\n    }\r\n  }\r\n  .search-area__item {\r\n    height: 32px;\r\n    display: flex;\r\n    flex-direction: row;\r\n    align-items: center;\r\n    &.search-area--action {\r\n      justify-content: end;\r\n    }\r\n    .expand-collapse {\r\n      margin-left: 8px;\r\n      height: 32px;\r\n      padding: 4px 16px;\r\n      color: var(--idooel-primary-color);\r\n      display: flex;\r\n      flex-direction: row;\r\n      align-items: center;\r\n      justify-content: center;\r\n      cursor: pointer;\r\n      .expand-collapse__text {\r\n        font-size: 14px;\r\n      }\r\n      .expand-collapse__icon {\r\n        font-size: 16px;\r\n        margin-left: 8px;\r\n      }\r\n    }\r\n  }\r\n}\r\n</style>",".search-area__wrapper {\n  padding-top: 16px;\n  padding-left: 16px;\n  padding-right: 16px;\n}\n.search-area__wrapper ::v-deep .ant-col:last-child {\n  float: right;\n}\n.search-area__wrapper .search-area__item {\n  height: 32px;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n}\n.search-area__wrapper .search-area__item.search-area--action {\n  justify-content: end;\n}\n.search-area__wrapper .search-area__item .expand-collapse {\n  margin-left: 8px;\n  height: 32px;\n  padding: 4px 16px;\n  color: var(--idooel-primary-color);\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n}\n.search-area__wrapper .search-area__item .expand-collapse .expand-collapse__text {\n  font-size: 14px;\n}\n.search-area__wrapper .search-area__item .expand-collapse .expand-collapse__icon {\n  font-size: 16px;\n  margin-left: 8px;\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined });
+    inject("data-v-06dd8a38_0", { source: ".search-area__wrapper[data-v-06dd8a38] {\n  padding-top: 16px;\n  padding-left: 16px;\n  padding-right: 16px;\n}\n.search-area__wrapper[data-v-06dd8a38]  .ant-col:last-child {\n  float: right;\n}\n.search-area__wrapper .search-area__item[data-v-06dd8a38] {\n  height: 32px;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n}\n.search-area__wrapper .search-area__item.search-area--action[data-v-06dd8a38] {\n  justify-content: end;\n}\n.search-area__wrapper .search-area__item .expand-collapse[data-v-06dd8a38] {\n  margin-left: 8px;\n  height: 32px;\n  padding: 4px 16px;\n  color: var(--idooel-primary-color);\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n}\n.search-area__wrapper .search-area__item .expand-collapse .expand-collapse__text[data-v-06dd8a38] {\n  font-size: 14px;\n}\n.search-area__wrapper .search-area__item .expand-collapse .expand-collapse__icon[data-v-06dd8a38] {\n  font-size: 16px;\n  margin-left: 8px;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["C:\\Users\\ZOU\\Code\\OnlineStudy\\base-elearning-frontend-model\\packages\\components\\packages\\composite-components\\search-area\\src\\index.vue","index.vue"],"names":[],"mappings":"AAyMA;EACA,iBAAA;EACA,kBAAA;EACA,mBAAA;ACxMA;AD0MA;EACA,YAAA;ACxMA;AD2MA;EACA,YAAA;EACA,aAAA;EACA,mBAAA;EACA,mBAAA;ACzMA;AD0MA;EACA,oBAAA;ACxMA;AD0MA;EACA,gBAAA;EACA,YAAA;EACA,iBAAA;EACA,kCAAA;EACA,aAAA;EACA,mBAAA;EACA,mBAAA;EACA,uBAAA;EACA,eAAA;ACxMA;ADyMA;EACA,eAAA;ACvMA;ADyMA;EACA,eAAA;EACA,gBAAA;ACvMA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["<template>\r\n  <div class=\"search-area__wrapper\">\r\n    <a-row :gutter=\"gutter\">\r\n      <template v-for=\"(item, idx) in innerDataSource\">\r\n        <a-col v-if=\"item._show\" :span=\"item.span || span\" :key=\"idx\">\r\n          <div v-if=\"item.type == '_action'\" class=\"search-area__item search-area--action\">\r\n            <ele-button icon=\"search\" type=\"primary\" @click=\"handleClickSearch\">查询</ele-button>\r\n            <ele-button style=\"margin-left:8px;\" icon=\"reload\" @click=\"handleClickReset\">重置</ele-button>\r\n            <div v-if=\"innerDataSource.length > cuttingFormula + 1\" class=\"expand-collapse\" @click=\"handleClickExpandCollapse\">\r\n              <span class=\"expand-collapse__text\">{{ isExpand ? '收起' : '展开' }}</span>\r\n              <span class=\"expand-collapse__icon\">\r\n                <a-icon v-if=\"isExpand\" type=\"up\" />\r\n                <a-icon v-else type=\"down\" />\r\n              </span>\r\n            </div>\r\n          </div>\r\n          <div v-else class=\"search-area__item\">\r\n            <template v-if=\"(item.type == 'ele-input') || (item.type == 'Input')\">\r\n              <Label :label=\"item.label\"></Label>\r\n              <ele-input v-model=\"item._value\"></ele-input>\r\n            </template>\r\n            <template v-else-if=\"(item.type == 'ele-select') || (item.type == 'Select')\">\r\n              <Label :label=\"item.label\"></Label>\r\n              <ele-select v-model=\"item._value\" :init=\"item.init\" :mode=\"item.mode\" :code=\"item.code\" :params=\"item.params\" :url=\"item.url\" :multiple=\"item.multiple\" :data-source=\"item.optionList\"></ele-select>\r\n            </template>\r\n            <template v-else-if=\"(item.type == 'ele-date') || (item.type == 'DatePicker')\">\r\n              <Label :label=\"item.label\"></Label>\r\n              <ele-date v-model=\"item._value\" :placeholder=\"item.placeholder\" :format=\"item.format\"></ele-date>\r\n            </template>\r\n            <template v-else-if=\"item.type == 'ele-date-range'\">\r\n              <Label :label=\"item.label\"></Label>\r\n              <ele-date-range v-model=\"item._value\" :format=\"item.format\" :show-time=\"item.showTime\"></ele-date-range>\r\n            </template>\r\n          </div>\r\n        </a-col>\r\n      </template>\r\n    </a-row>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport Label from './label.vue'\r\nimport moment from 'moment'\r\nimport { parse } from '@idooel/expression'\r\nimport { type } from '@idooel/shared'\r\nexport default {\r\n  name: 'ele-search-area',\r\n  components: {\r\n    Label\r\n  },\r\n  props: {\r\n    gutter: {\r\n      type: [Number, Array, Object],\r\n      default: () => ([\r\n        16, 8\r\n      ])\r\n    },\r\n    span: {\r\n      type: Number,\r\n      default: 8\r\n    },\r\n    dataSource: {\r\n      type: Array,\r\n      required: true\r\n    }\r\n  },\r\n  data() {\r\n    return {\r\n      isExpand: false\r\n    }\r\n  },\r\n  computed: {\r\n    cuttingFormula () {\r\n      return (24 / this.span - 1)\r\n    },\r\n    buildDataSource () {\r\n      return this.controlDisplayByFormula(this.mapDefaultValueToValue())\r\n    },\r\n    innerDataSource () {\r\n      return [ ...this.buildDataSource, { type: '_action', _show: true }]\r\n    }\r\n  },\r\n  created() {\r\n    const querys = this.extractValues()\r\n    this.$emit('search', { ...querys, initSearch: true })\r\n  },\r\n  methods: {\r\n    controlDisplayByFormula (dataSource = []) {\r\n      if (this.isExpand) {\r\n        dataSource.forEach(item => {\r\n          this.$set(item, '_show', true)\r\n        })\r\n      } else {\r\n        dataSource.forEach((item, idx) => {\r\n          if (idx < this.cuttingFormula) {\r\n            this.$set(item, '_show', true)\r\n          } else {\r\n            this.$set(item, '_show', false)\r\n          }\r\n        })\r\n      }\r\n      return dataSource\r\n    },\r\n    buildDefaultValue (arg) {\r\n      if (type.isFunction(arg)) return arg.call(this)\r\n      if (type.notStr(arg)) return arg\r\n      if (!arg || arg.charAt(0) !== '_') return arg\r\n      return parse(arg, {\r\n        _route: this.$route.query\r\n      })\r\n    },\r\n    mapDefaultValueToValue () {\r\n      this.dataSource.forEach(props => {\r\n        this.$set(props, '_show', this.isExpand)\r\n        if (props.defaultValue) {\r\n          if (type.isFunction(props.defaultValue)) {\r\n            const ret = props.defaultValue.call(this)\r\n            this.$set(props, '_value', this.buildDefaultValue(ret))\r\n          } else {\r\n            this.$set(props, '_value', this.buildDefaultValue(props.defaultValue))\r\n          }\r\n        }\r\n      })\r\n      return this.dataSource\r\n    },\r\n    handleClickExpandCollapse () {\r\n      this.isExpand = !this.isExpand\r\n    },\r\n    handleClickSearch () {\r\n      const querys = this.extractValues()\r\n      this.$emit('search', querys)\r\n    },\r\n    buildMapto (mapTo = [], dataSource) {\r\n      const [ startField, endField ] = mapTo\r\n      const [ startValue, endValue ] = dataSource || [null, null]\r\n      return {\r\n        [startField]: startValue,\r\n        [endField]: endValue\r\n      }\r\n    },\r\n    extractValues () {\r\n      let ret = {}\r\n      this.innerDataSource.filter(item => item.type !== '_action').forEach(item => {\r\n        switch (item.type) {\r\n          case 'DatePicker':\r\n            ret[item.name] = typeof item._value == 'undefined' ? undefined : moment(item._value).format(item.format)\r\n            break\r\n          case 'ele-date-range':\r\n            if (item.mapTo) {\r\n              Object.assign(ret, this.buildMapto(item.mapTo, item._value))\r\n            } else {\r\n              ret[item.name] = (item._value || []).join(',')\r\n            }\r\n            break\r\n          default:\r\n            ret[item.name] = item._value\r\n            break\r\n        }\r\n      })\r\n      return ret\r\n    },\r\n    cleanValues () {\r\n      this.innerDataSource.filter(item => item.type !== '_action').forEach(item => {\r\n        const { defaultValue } = item\r\n        switch (item.type) {\r\n          case 'Select':\r\n            defaultValue && this.$set(item, '_value', this.buildDefaultValue(defaultValue))\r\n            !defaultValue && this.$set(item, '_value', null)\r\n            break\r\n          case 'DatePicker':\r\n            defaultValue && this.$set(item, '_value', this.buildDefaultValue(defaultValue))\r\n            !defaultValue && this.$set(item, '_value', undefined)\r\n            break\r\n          case 'ele-date-range':\r\n            defaultValue && this.$set(item, '_value', this.buildDefaultValue(defaultValue))\r\n            !defaultValue && this.$set(item, '_value', [])\r\n            break\r\n          default:\r\n            defaultValue && this.$set(item, '_value', this.buildDefaultValue(defaultValue))\r\n            !defaultValue && this.$set(item, '_value', null)\r\n            break\r\n        }\r\n      })\r\n    },\r\n    handleClickReset () {\r\n      this.cleanValues()\r\n      //TODO defaultValue\r\n      const querys = this.extractValues()\r\n      this.$emit('search', querys)\r\n    },\r\n    onChangeSelect (value, props) {\r\n      this.$set(props, '_value', value)\r\n    }\r\n  },\r\n  destroyed () {\r\n    this.cleanValues()\r\n  }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.search-area__wrapper {\r\n  padding-top: 16px;\r\n  padding-left: 16px;\r\n  padding-right: 16px;\r\n  ::v-deep .ant-col {\r\n    &:last-child {\r\n      float: right;\r\n    }\r\n  }\r\n  .search-area__item {\r\n    height: 32px;\r\n    display: flex;\r\n    flex-direction: row;\r\n    align-items: center;\r\n    &.search-area--action {\r\n      justify-content: end;\r\n    }\r\n    .expand-collapse {\r\n      margin-left: 8px;\r\n      height: 32px;\r\n      padding: 4px 16px;\r\n      color: var(--idooel-primary-color);\r\n      display: flex;\r\n      flex-direction: row;\r\n      align-items: center;\r\n      justify-content: center;\r\n      cursor: pointer;\r\n      .expand-collapse__text {\r\n        font-size: 14px;\r\n      }\r\n      .expand-collapse__icon {\r\n        font-size: 16px;\r\n        margin-left: 8px;\r\n      }\r\n    }\r\n  }\r\n}\r\n</style>",".search-area__wrapper {\n  padding-top: 16px;\n  padding-left: 16px;\n  padding-right: 16px;\n}\n.search-area__wrapper ::v-deep .ant-col:last-child {\n  float: right;\n}\n.search-area__wrapper .search-area__item {\n  height: 32px;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n}\n.search-area__wrapper .search-area__item.search-area--action {\n  justify-content: end;\n}\n.search-area__wrapper .search-area__item .expand-collapse {\n  margin-left: 8px;\n  height: 32px;\n  padding: 4px 16px;\n  color: var(--idooel-primary-color);\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n}\n.search-area__wrapper .search-area__item .expand-collapse .expand-collapse__text {\n  font-size: 14px;\n}\n.search-area__wrapper .search-area__item .expand-collapse .expand-collapse__icon {\n  font-size: 16px;\n  margin-left: 8px;\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined });
 
   };
   /* scoped */
-  const __vue_scope_id__$b = "data-v-77b7e5ba";
+  const __vue_scope_id__$b = "data-v-06dd8a38";
   /* module identifier */
   const __vue_module_identifier__$b = undefined;
   /* functional template */
@@ -14795,8 +14801,8 @@ var script$4 = {
       const currentTableSelectionRet = type.isArray(currentTableSelection) ? currentTableSelection : [currentTableSelection];
       this.entityValue = currentTableSelectionRet.map(item => {
         return {
-          label: item[this.replaceFields.label],
-          value: item[this.replaceFields.value]
+          label: item[this.returnValues[this.replaceFields.label]],
+          value: item[this.returnValues[this.replaceFields.value]]
         };
       });
       this.emitEntityValue(currentTableSelection);

package/dist/@idooel/components.umd.js

@@ -3286,7 +3286,10 @@
             ...this.exposed
           });
         } else {
-          if (this.showTree) return;
+          const {
+            initSearch = false
+          } = props;
+          if (this.showTree && initSearch) return;
           this.tableData = await this.requestTableData();
         }
       },
@@ -3639,11 +3642,11 @@
     /* style */
     const __vue_inject_styles__$A = function (inject) {
       if (!inject) return
-      inject("data-v-6e8ad2fe_0", { source: ".ele.model__tree-table[data-v-6e8ad2fe] {\n  background: transparent;\n  display: flex;\n  flex-direction: row;\n  width: 100%;\n}\n.ele.model__tree-table .model__tree-table--container .model__tree--wrapper[data-v-6e8ad2fe] {\n  width: 240px;\n  background: #fff;\n  flex-shrink: 0;\n  padding: 16px;\n  box-sizing: border-box;\n  margin-right: 16px;\n  overflow-y: auto;\n}\n.ele.model__tree-table .model__table--container[data-v-6e8ad2fe] {\n  width: 100%;\n  min-width: 0;\n  background: #fff;\n}\n.ele.model__tree-table .model__table--container .model__table--title .model__table-title--bar[data-v-6e8ad2fe] {\n  width: 100%;\n  height: 8px;\n  background: var(--idooel-primary-color);\n  border-top-left-radius: 4px;\n  border-top-right-radius: 4px;\n}\n.ele.model__tree-table .model__table--container .model__table--title .model__table-title--text[data-v-6e8ad2fe] {\n  text-align: left;\n  padding: 16px;\n  font-size: 16px;\n  font-weight: bold;\n  background: #fff;\n  border-bottom: 1px solid;\n  border-color: var(--idoole-black-016);\n}\n.ele.model__tree-table .model__table--container .model__table--wrapper[data-v-6e8ad2fe] {\n  background: #fff;\n}\n.ele.model__tree-table .model__table--container .model__table--wrapper .button-row__area[data-v-6e8ad2fe] {\n  width: 100%;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n  padding-top: 16px;\n  padding-bottom: 8px;\n  padding-right: 16px;\n}\n.ele.model__tree-table .model__table--container .model__table--wrapper .g-table__wrapper .fsm[data-v-6e8ad2fe] {\n  cursor: pointer;\n  color: var(--idooel-primary-color);\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["C:\\Users\\ZOU\\Code\\OnlineStudy\\base-elearning-frontend-model\\packages\\components\\packages\\models\\tree-table-model\\src\\index.vue","index.vue"],"names":[],"mappings":"AAgwBA;EACA,uBAAA;EACA,aAAA;EACA,mBAAA;EACA,WAAA;AC/vBA;ADiwBA;EACA,YAAA;EACA,gBAAA;EACA,cAAA;EACA,aAAA;EACA,sBAAA;EACA,kBAAA;EACA,gBAAA;AC/vBA;ADkwBA;EACA,WAAA;EACA,YAAA;EACA,gBAAA;AChwBA;ADkwBA;EACA,WAAA;EACA,WAAA;EACA,uCAAA;EACA,2BAAA;EACA,4BAAA;AChwBA;ADkwBA;EACA,gBAAA;EACA,aAAA;EACA,eAAA;EACA,iBAAA;EACA,gBAAA;EACA,wBAAA;EACA,qCAAA;AChwBA;ADmwBA;EACA,gBAAA;ACjwBA;ADkwBA;EACA,WAAA;EACA,aAAA;EACA,mBAAA;EACA,mBAAA;EACA,8BAAA;EACA,iBAAA;EACA,mBAAA;EACA,mBAAA;AChwBA;ADmwBA;EACA,eAAA;EACA,kCAAA;ACjwBA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["<template>\r\n  <section class=\"ele model__tree-table\">\r\n    <section class=\"model__tree-table--container\" v-if=\"showTree\">\r\n      <div class=\"model__tree--title\"></div>\r\n      <section :ref=\"modelTreeWrapper\" class=\"model__tree--wrapper\" :style=\"{height: `${treeWrapperHeight}px`}\">\r\n        <ele-tree\r\n          :tree-data=\"treeData\"\r\n          :defaultExpandedKeys=\"defaultExpandedKeys\"\r\n          :defaultSelectedKeys=\"defaultSelectedKeys\"\r\n          @select=\"selectTreeNode\"\r\n          :replace-fields=\"mapFields\">\r\n        </ele-tree>\r\n      </section>\r\n    </section>\r\n    <section class=\"model__table--container\" :ref=\"modelTableContainerRef\">\r\n      <div class=\"model__table--title\" v-if=\"title\">\r\n        <template v-if=\"titleMode\">\r\n          <div :class=\"[`model__table-title--${titleMode}`]\"></div>\r\n        </template>\r\n        <template v-else>\r\n          <div class=\"model__table-title--text\">{{ title }}</div>\r\n        </template>\r\n      </div>\r\n      <section :ref=\"modelTableWrapper\" class=\"model__table--wrapper\">\r\n        <ele-search-area :ref=\"searchArea\" @search=\"onSearch\" :data-source=\"searchMeta.elements\"></ele-search-area>\r\n        <div class=\"button-row__area\">\r\n          <ele-button-group class=\"model-table__button-group\" v-on=\"overrideButtonGroupEvent\" :ref=\"buttonGroup\" @click=\"handleClickButtonGroup\" :data-source=\"getButtonGroupElements\"></ele-button-group>\r\n          <slot name=\"tags\"></slot>\r\n          <slot v-if=\"$slots['sub-center']\" name=\"sub-center\"></slot>\r\n        </div>\r\n        <ele-table\r\n          v-on=\"overrideTableEvent\"\r\n          :ref=\"tableRef\"\r\n          :row-selection=\"rowSelection\"\r\n          :loading=\"loading\" \r\n          :columns=\"columns\"\r\n          :total=\"total\"\r\n          :x=\"x\"\r\n          :y=\"y\"\r\n          :bordered=\"setBorder\"\r\n          :height=\"tableHeight\"\r\n          :width=\"tableWidth\"\r\n          :actions=\"actions\"\r\n          :pageSize=\"pageSize\"\r\n          :pageSizeOptions=\"pageSizeOptions\"\r\n          :data-source=\"tableData\"\r\n          @change-page=\"onChangePage\"\r\n        ></ele-table>\r\n      </section>\r\n    </section>\r\n    <ele-modal-form v-model=\"modalFormValue\" v-on=\"overrideModalFormEvent\" :meta=\"modalFormMeta\"></ele-modal-form>\r\n    <ele-modal-fsm v-model=\"showFsmModal\" :contextProp=\"fsmContextProp\" :meta=\"fsmMeta\" @cancel=\"handleCloseFsmModal\"></ele-modal-fsm>\r\n    <ele-modal-table\r\n      :meta=\"modalTableMeta\"\r\n      v-model=\"modalTableValue\"\r\n      v-on=\"overrideModalTableEvent\"\r\n    ></ele-modal-table>\r\n  </section>\r\n</template>\r\n\r\n<script>\r\nimport { type, net } from '@idooel/shared'\r\nimport { v4 as uuidv4 } from 'uuid'\r\nimport { BUILT_IN_EVENT_NAMES, RESERVE_EVENT_NAMES, parseFieldMap, BUILT_IN_TRIGGER, CONTEXT } from '../../../utils'\r\nimport { createTreeTableModel } from '../../../utils/runtime-context'\r\nexport default {\r\n  name: 'ele-tree-table-model',\r\n  props: {\r\n    title: {\r\n      type: [Object, String]\r\n    },\r\n    overHeight: {\r\n      type: Number,\r\n      default: 0\r\n    },\r\n    treeMeta: {\r\n      type: Object,\r\n      default: () => ({})\r\n    },\r\n    searchMeta: {\r\n      type: Object,\r\n      default: () => ({})\r\n    },\r\n    buttonGroupMeta: {\r\n      typeof: Object,\r\n      default: () => ({})\r\n    },\r\n    tableMeta: {\r\n      type: Object,\r\n      default: () => ({})\r\n    },\r\n    createMeta: {\r\n      type: Object\r\n    },\r\n    editMeta: {\r\n      type: Object\r\n    }\r\n  },\r\n  provide () {\r\n    return {\r\n      requestTreeData: this.requestTreeData,\r\n      requestTableData: this.requestTableData,\r\n      keepAliveRefresh: this.keepAliveRefresh,\r\n      [CONTEXT]: () => {\r\n        return {\r\n          exposed: this.exposed\r\n        }\r\n      }\r\n    }\r\n  },\r\n  data () {\r\n    return {\r\n      tableHeight: 0,\r\n      tableWidth: 0,\r\n      modalFormMeta: {},\r\n      modalFormValue: false,\r\n      treeData: [],\r\n      tableData: [],\r\n      defaultExpandedKeys: [],\r\n      defaultSelectedKeys: [],\r\n      replaceFields: {\r\n        title: 'title',\r\n        children: 'children',\r\n        key: 'id'\r\n      },\r\n      loading: false,\r\n      total: 0,\r\n      tableQuerys: {},\r\n      resizeObserverModelTableWrapper: null,\r\n      modelTableWrapperHeight: 0,\r\n      currentTreeNodeData: {},\r\n      currentRowData: {},\r\n      treeWrapperHeight: 0,\r\n      currentTableSelection: this.currentTableMode == 'radio' ? {} : [],\r\n      showFsmModal: false,\r\n      fsmMeta: {},\r\n      fsmContextProp: {},\r\n      modalTableValue: false,\r\n      modalTableMeta: {},\r\n      dataPoolManager: null\r\n    }\r\n  },\r\n  computed: {\r\n    setBorder () {\r\n      return this.tableMeta.bordered === false ? false : true\r\n    },\r\n    rowSelection () {\r\n      if (!this.currentTableMode) return void 0\r\n      return {\r\n        columnTitle: this.currentSelectionColumn.columnTitle,\r\n        fixed: true,\r\n        type: this.currentTableMode,\r\n        onChange: this.onChangeTableSelection\r\n      }\r\n    },\r\n    currentSelectionColumn () {\r\n      const { multiple } = this.tableMeta\r\n      const target = this.columns.find(item => Object.keys(item).includes('multiple'))\r\n      const isGlobalExistMultiple = Object.keys(this.tableMeta).includes('multiple')\r\n      if (target) {\r\n        return target\r\n      } else if (isGlobalExistMultiple) {\r\n        return { multiple }\r\n      }\r\n      return void 0\r\n    },\r\n    x () {\r\n      const { x } = this.tableMeta\r\n      return x\r\n    },\r\n    y () {\r\n      const { y } = this.tableMeta\r\n      return y\r\n    },\r\n    currentTableMode () {\r\n      if (!this.currentSelectionColumn) return void 0\r\n      const { multiple } = this.currentSelectionColumn\r\n      if (type.isBool(multiple)) {\r\n        if (multiple) {\r\n          return 'checkbox'\r\n        } else {\r\n          return 'radio'\r\n        }\r\n      } else {\r\n        return void 0\r\n      }\r\n    },\r\n    modelTableContainerRef () {\r\n      return uuidv4()\r\n    },\r\n    titleMode () {\r\n      if (type.isObject(this.title)) {\r\n        const { mode = '' } = this.title\r\n        return mode\r\n      }\r\n      return void 0\r\n    },\r\n    tableRef () {\r\n      return uuidv4()\r\n    },\r\n    exposed () {\r\n      return {\r\n        showModalForm: this.showModalForm,\r\n        closeModalForm: this.closeModalForm,\r\n        showModalTable: this.showModalTable,\r\n        closeModalTable: this.closeModalTable,\r\n        currentTableSelection: this.currentTableSelection,\r\n        currentTreeNode: this.currentTreeNodeData,\r\n        requestTableData: this.requestTableData,\r\n        keepAliveRefresh: this.keepAliveRefresh,\r\n        refreshTreeData: this.refreshTreeData,\r\n        querys: this.tableQuerys,\r\n        currentRowData: this.getCurrentRowData(),\r\n        getCurrentRowData: this.getCurrentRowData,\r\n        setCurrentRowData: this.setCurrentRowData,\r\n        setCurrentTableSelection: this.setCurrentTableSelection,\r\n        getCurrentTableSelection: this.getCurrentTableSelection,\r\n        cleanCurrentModelEffect: this.cleanCurrentModelEffect,\r\n        route: this.$route,\r\n        _route: this.$route.query,\r\n        _routeMeta: this.$route.meta,\r\n        dataPool: this.model ? this.model.getDataPool() : null,\r\n        dataPoolManager: this.model || null\r\n      }\r\n    },\r\n    overrideTableEvent () {\r\n      const events = this.actions.reduce((ret, action) => {\r\n        ret[action.eventName || action.key] = (e) => {\r\n          this.setCurrentRowData(e.exposed.currentRowData)\r\n          const { target } = action\r\n          const targetMeta = this.findMetaByKey(target)\r\n          const { mode } = targetMeta\r\n          mode && this.dispatchTrigger({ mode, record: e.exposed.currentRowData, modeMeta: targetMeta })\r\n          this.$emit(action.eventName || action.key, { ...e, currentTreeNode: this.currentTreeNodeData, exposed: { ...this.exposed, ...e.exposed } })\r\n        }\r\n        return ret\r\n      }, {})\r\n      return {\r\n        ...this.$listeners,\r\n        ...events,\r\n        [BUILT_IN_EVENT_NAMES.EDIT]: this[BUILT_IN_EVENT_NAMES.EDIT],\r\n        [BUILT_IN_EVENT_NAMES.SUBMIT]: this[BUILT_IN_EVENT_NAMES.SUBMIT]\r\n      }\r\n    },\r\n    overrideModalFormEvent () {\r\n      const { footerMeta } = this.modalFormMeta\r\n      const { elements = [] } = footerMeta || {}\r\n      const eles = type.isFunction(elements) ? elements.call(this) : elements\r\n      const events = eles.reduce((ret, ele) => {\r\n        ret[ele.eventName] = (e = {}) => {\r\n          if (ele.eventName === 'cancel') {\r\n            this.closeModalForm()\r\n          } else {\r\n            const { exposed = {} } = e\r\n            this.$emit(`${ele.eventName || ele.key}`, { ...e, currentTreeNode: this.currentTreeNodeData, exposed: Object.assign({}, exposed )})\r\n          }\r\n        }\r\n        return ret\r\n      }, {})\r\n      return {\r\n        ...events\r\n      }\r\n    },\r\n    overrideModalTableEvent () {\r\n      const { footerMeta } = this.modalTableMeta\r\n      const { elements = [] } = footerMeta || {}\r\n      const eles = type.isFunction(elements) ? elements.call(this) : elements\r\n      const events = eles.reduce((ret, ele) => {\r\n        ret[ele.eventName] = (e = {}) => {\r\n          if (ele.eventName === 'cancel') {\r\n            this.closeModalTable()\r\n          } else {\r\n            const { exposed = {} } = e\r\n            this.$emit(`${ele.eventName || ele.key}`, { ...e, currentTreeNode: this.currentTreeNodeData, exposed: Object.assign({}, exposed )})\r\n          }\r\n        }\r\n        return ret\r\n      }, {})\r\n      return {\r\n        ...events,\r\n        exposed: this.exposed\r\n      }\r\n    },\r\n    overrideButtonGroupEvent () {\r\n      const events = this.getButtonGroupElements.reduce((ret, ele) => {\r\n        ret[ele.eventName] = (e) => {\r\n          this.$emit(ele.eventName || 'click', { ...e, currentTreeNode: this.currentTreeNodeData, exposed: Object.assign({}, e.exposed || {}, this.exposed)})\r\n        }\r\n        return ret\r\n      }, {})\r\n      return {\r\n        ...this.$listeners,\r\n        ...events,\r\n        [BUILT_IN_EVENT_NAMES.CREATE]: this[BUILT_IN_EVENT_NAMES.CREATE],\r\n        exposed: this.exposed\r\n      }\r\n    },\r\n    showTree () {\r\n      return !!Object.keys(this.treeMeta).length\r\n    },\r\n    buttonGroup () {\r\n      return uuidv4()\r\n    },\r\n    searchArea () {\r\n      return uuidv4()\r\n    },\r\n    modelTreeWrapper () {\r\n      return uuidv4()\r\n    },\r\n    modelTableWrapper () {\r\n      return uuidv4()\r\n    },\r\n    actions () {\r\n      const { operations } = this.tableMeta\r\n      if (operations) {\r\n        return operations.elements\r\n      } else {\r\n        return []\r\n      }\r\n    },\r\n    pageSize () {\r\n      const { page = {} } = this.tableMeta\r\n      return page.pageSize || 10\r\n    },\r\n    pageSizeOptions () {\r\n      const { page = {} } = this.tableMeta\r\n      return page.pageSizeOptions || ['10', '20', '30', '40']\r\n    },\r\n    columns () {\r\n      const { columns, operations } = this.tableMeta\r\n      if (type.get(columns) === 'array') {\r\n        const columnsOptions = columns.map(item => {\r\n          const { mode = 'text' } = item\r\n          if (item.render) {\r\n            return {\r\n              ...item,\r\n              customRender: (text, record, index) => {\r\n                const { $createElement } = this\r\n                return item.render.call(this, \r\n                  { h: $createElement, ctx: this },\r\n                  text ? typeof text == 'object' ? text[item.dataIndex] : text : '', \r\n                  record, index)\r\n              }\r\n            }\r\n          } else if (mode !== BUILT_IN_TRIGGER.TEXT) {\r\n            const { [`${mode}Meta`]: modeMeta } = item\r\n            return {\r\n              ...item,\r\n              customRender: (text, record, index) => {\r\n                return <span onClick={() => this.dispatchTrigger({ mode, record, modeMeta, index })} class={ mode }>{ text }</span>\r\n              }\r\n            }\r\n          }\r\n          return {\r\n            ...item\r\n          }\r\n        })\r\n        if (operations) {\r\n          return [\r\n            ...columnsOptions,\r\n            {\r\n              title: '操作',\r\n              width: operations.width,\r\n              key: 'action',\r\n              fixed: 'right',\r\n              scopedSlots: { customRender: 'action' }\r\n            }\r\n          ]\r\n        }\r\n        return columnsOptions\r\n      } else {\r\n        console.error('Error: columns is invalid, please check it')\r\n        return []\r\n      }\r\n    },\r\n    getButtonGroupElements () {\r\n      const { elements } = this.buttonGroupMeta\r\n      if (type.get(elements) === 'function') {\r\n        return elements.call(this)\r\n      } else if (type.get(elements) === 'array') {\r\n        return elements\r\n      } else {\r\n        return []\r\n      }\r\n    },\r\n    mapFields () {\r\n      const { replaceFields = {} } = this.treeMeta\r\n      const mapFields = type.isEmpty(replaceFields) ? this.replaceFields : replaceFields\r\n      return mapFields\r\n    }\r\n  },\r\n  async created () {\r\n    // onSearch会初始化请求表格数据，所以不需要在这里请求表格数据\r\n    // 确保全局数据池已初始化\r\n    if (!window.__idooel_data_pool__) {\r\n      console.error('Global data pool not initialized. Please check if runtime-context/globalDataPool.js is properly imported.')\r\n      return\r\n    }\r\n    \r\n    // 初始化数据池管理器（使用新的 runtime-context）\r\n    try {\r\n      this.model = createTreeTableModel('treeTableModel')\r\n      \r\n      if (!this.model) {\r\n        throw new Error('Failed to create tree table model')\r\n      }\r\n    } catch (error) {\r\n      console.error('Error creating tree table model:', error)\r\n      this.model = null\r\n      return\r\n    }\r\n    \r\n    // 初始化 currentRowData（尝试从共享命名空间获取）\r\n    this.initializeCurrentRowData()\r\n    \r\n    // 订阅数据池变化\r\n    this.unsubscribe = this.model.subscribe('currentRowData', (event) => {\r\n      this.currentRowData = event.value || {}\r\n      this.$forceUpdate()\r\n    })\r\n    \r\n    // 订阅共享数据变化\r\n    this.unsubscribeShared = this.model.subscribeShared((event) => {\r\n      // 当有新的共享数据时，更新当前组件的 currentRowData\r\n      if (event.value && Object.keys(event.value).length > 0) {\r\n        this.setCurrentRowData(event.value)\r\n      }\r\n    })\r\n    \r\n    if (this.showTree) {\r\n      this.treeData = await this.requestTreeData()\r\n      const [defaultTreeNode = {}] = this.treeData\r\n      this.defaultExpandedKeys = [defaultTreeNode[this.mapFields.key]]\r\n      this.defaultSelectedKeys = [defaultTreeNode[this.mapFields.key]]\r\n      this.currentTreeNodeData = defaultTreeNode\r\n      const { params = {}, fieldMap = {}, overrideInit = false } = this.tableMeta\r\n      const currentRowData = this.getCurrentRowData()\r\n      const ctx = { \r\n        ...this.currentTreeNodeData, \r\n        _route: this.$route.query, \r\n        currentRowData: currentRowData\r\n      }\r\n      \r\n      const initQuerys = Object.assign({}, params, parseFieldMap(fieldMap, ctx))\r\n      if (overrideInit) {\r\n        this.$emit(RESERVE_EVENT_NAMES.INIT, { ...this.exposed })\r\n      } else {\r\n        this.tableData = await this.requestTableData(initQuerys)\r\n      }\r\n    }\r\n  },\r\n  methods: {\r\n    initializeCurrentRowData () {\r\n      if (!this.model) {\r\n        console.warn('Model not initialized, skipping currentRowData initialization')\r\n        return\r\n      }\r\n      \r\n      // 检查是否有来自父组件的共享数据（比如 modal table 场景）\r\n      const parentData = this.model.getSharedData()\r\n      \r\n      if (parentData && Object.keys(parentData).length > 0) {\r\n        this.setCurrentRowData(parentData)\r\n        return\r\n      }\r\n      \r\n      // 可以根据路由参数、props 或其他来源设置初始的 currentRowData\r\n      const { query } = this.$route\r\n      \r\n      // 示例：如果路由中有特定参数，可以设置为 currentRowData\r\n      if (query.rowId || query.selectedId) {\r\n        // 这里可以根据实际需求从服务端或其他地方获取数据\r\n        // const presetData = { id: query.rowId, /* 其他字段 */ }\r\n        // this.setCurrentRowData(presetData)\r\n      }\r\n      \r\n      // 目前保持空对象，等待用户选择行数据\r\n    },\r\n    async refreshTreeData () {\r\n      this.treeData = await this.requestTreeData()\r\n      const [defaultTreeNode = {}] = this.treeData\r\n      this.defaultExpandedKeys = [defaultTreeNode[this.mapFields.key]]\r\n      this.defaultSelectedKeys = [defaultTreeNode[this.mapFields.key]]\r\n      this.currentTreeNodeData = defaultTreeNode\r\n    },\r\n    dispatchTrigger ({ mode, record = {}, modeMeta = { } }) {\r\n      switch (mode) {\r\n        case BUILT_IN_TRIGGER.FSM:\r\n          this[`${BUILT_IN_TRIGGER.FSM}Trigger`](record, modeMeta = type.isEmpty(modeMeta) ? { \r\n            url: 'api-fsm/workbench/fsm/auditFlow',\r\n            requestType: 'GET',\r\n            fieldMap: {\r\n              modelCode: 'modelCode',\r\n              businessId: 'businessId'\r\n            }\r\n          } : modeMeta)\r\n          break\r\n        case BUILT_IN_TRIGGER.ELE_MODAL_FORM:\r\n          this.modalFormMeta = modeMeta\r\n          this.showModalForm(modeMeta)\r\n          break\r\n        case BUILT_IN_TRIGGER.ELE_MODAL_TABLE:\r\n          this.modalTableMeta = modeMeta\r\n          // 将当前行的 record 数据传递给 modal table\r\n          this.showModalTable(modeMeta, record)\r\n          break\r\n        default:\r\n          break\r\n      }\r\n    },\r\n    handleCloseFsmModal () {\r\n      this.showFsmModal = false\r\n    },\r\n    [`${BUILT_IN_TRIGGER.FSM}Trigger`] (record, meta) {\r\n      this.fsmMeta = meta\r\n      this.fsmContextProp = record\r\n      this.showFsmModal = true\r\n    },\r\n    onChangeTableSelection (_, selectedRows = []) {\r\n      if (this.currentTableMode === 'radio') {\r\n        this.setCurrentTableSelection(selectedRows)\r\n        this.$emit('on-change-table-selection', this.currentTableSelection)\r\n        this.$emit('x:refresh-exposed', { exposed: this.exposed })\r\n      } else {\r\n        this.setCurrentTableSelection(selectedRows)\r\n        this.$emit('on-change-table-selection', this.currentTableSelection)\r\n        this.$emit('x:refresh-exposed', { exposed: this.exposed })\r\n      }\r\n    },\r\n    setCurrentTableSelection (props = {}) {\r\n      if (this.currentTableMode === 'radio') {\r\n        this.$set(this, 'currentTableSelection', (type.isArray(props) && props.length > 0) ? props[0] : type.isObject(props) ? props : {})\r\n      } else {\r\n        this.$set(this, 'currentTableSelection', type.isArray(props) ? props : [])\r\n      }\r\n    },\r\n    getCurrentTableSelection () {\r\n      return this.currentTableSelection\r\n    },\r\n    setCurrentRowData (props = {}) {\r\n      this.currentRowData = props\r\n      if (this.model) {\r\n        this.model.setCurrentRowData(props)\r\n      } else {\r\n        console.warn('Model not initialized, cannot setCurrentRowData in model')\r\n      }\r\n    },\r\n    getCurrentRowData () {\r\n      if (this.model) {\r\n        return this.model.getCurrentRowData()\r\n      }\r\n      console.warn('Model not initialized, getCurrentRowData returning local data')\r\n      return this.currentRowData || {}\r\n    },\r\n    cleanCurrentModelEffect (clearRowData = true) {\r\n      this.setCurrentTableSelection()\r\n      if (clearRowData) {\r\n        this.setCurrentRowData({})\r\n      }\r\n    },\r\n    [BUILT_IN_EVENT_NAMES.SUBMIT] (props = {}) {\r\n      this.cleanCurrentModelEffect()\r\n      this.requestTableData()\r\n    },\r\n    [BUILT_IN_EVENT_NAMES.EDIT] (props = {}) {\r\n      const { record = {} } = props\r\n      this.setCurrentRowData(record)\r\n      this.modalFormMeta = this.editMeta\r\n      this.modalFormValue = true\r\n    },\r\n    [BUILT_IN_EVENT_NAMES.CREATE] () {\r\n      this.modalFormMeta = this.createMeta\r\n      this.modalFormValue = true\r\n    },\r\n    showModalForm (modeMeta = {}) {\r\n      if (type.isStr(modeMeta)) {\r\n        const targetMeta = this.findMetaByKey(modeMeta)\r\n        this.modalFormMeta = targetMeta\r\n      } else {\r\n        this.modalFormMeta = modeMeta\r\n      }\r\n      this.modalFormValue = true\r\n    },\r\n    showModalTable (modeMeta = {}, record = null) {\r\n      // 获取当前行数据并设置到共享命名空间\r\n      const currentRowData = record || this.getCurrentRowData()\r\n      if (this.model) {\r\n        this.model.setSharedData(currentRowData)\r\n      } else {\r\n        console.warn('Model not initialized, cannot setSharedData')\r\n      }\r\n      \r\n      let targetMeta = modeMeta\r\n      if (type.isStr(modeMeta)) {\r\n        targetMeta = this.findMetaByKey(modeMeta)\r\n      }\r\n      \r\n      // 解析 fieldMap 参数，使用完整的上下文包括 currentRowData\r\n      if (targetMeta && targetMeta.fieldMap) {\r\n        const { fieldMap, params = {} } = targetMeta\r\n        \r\n        const ctx = { \r\n          ...this.currentTreeNodeData, \r\n          _route: this.$route.query, \r\n          ...currentRowData \r\n        }\r\n        const parsedParams = parseFieldMap(fieldMap, ctx)\r\n        \r\n        // 将当前的 currentRowData 传递给 modal table，通过 params\r\n        targetMeta = {\r\n          ...targetMeta,\r\n          params: {\r\n            ...params,\r\n            ...parsedParams\r\n          }\r\n        }\r\n      }\r\n      \r\n      this.modalTableMeta = targetMeta\r\n      this.modalTableValue = true\r\n    },\r\n    closeModalForm () {\r\n      this.modalFormValue = false\r\n    },\r\n    closeModalTable () {\r\n      this.modalTableValue = false\r\n    },\r\n    findMetaByKey (key) {\r\n      return this.$attrs[key] || {}\r\n    },\r\n    handleClickButtonGroup (props) {\r\n      const { eventName, target } = props\r\n      const targetMeta = this.findMetaByKey(target)\r\n      const { mode } = targetMeta\r\n      mode && this.dispatchTrigger({ mode, modeMeta: targetMeta })\r\n      this.$emit(eventName || 'click', { currentTreeNode: this.currentTreeNodeData })\r\n    },\r\n    async onSearch (props) {\r\n      const { overrideInit = false } = this.tableMeta\r\n      this.tableQuerys = Object.assign(this.tableQuerys, props)\r\n      if (overrideInit) {\r\n        this.$emit(RESERVE_EVENT_NAMES.TREE_CHANGE, { ...this.exposed })\r\n      } else {\r\n        if (this.showTree) return\r\n        this.tableData = await this.requestTableData()\r\n      }\r\n    },\r\n    async selectTreeNode (selectedKeys, e) {\r\n      const { fieldMap } = this.tableMeta\r\n      this.currentTreeNodeData = e.node.$vnode.data.props.dataRef || {}\r\n      //@deprecated '_' namespace is deprecated, please use 'exposed' instead\r\n      const execFieldMapRet = parseFieldMap(fieldMap, { ...this.currentTreeNodeData, exposed: this.exposed, _route: this.exposed._route })\r\n      const { overrideInit = false } = this.tableMeta\r\n      if (overrideInit) {\r\n        this.$emit(RESERVE_EVENT_NAMES.TREE_CHANGE, { ...this.exposed })\r\n      } else {\r\n        this.tableData = await this.requestTableData(execFieldMapRet)\r\n      }\r\n    },\r\n    async requestTreeData () {\r\n      const { url, requestType = 'GET', params = {}, fieldMap = {} } = this.treeMeta\r\n      const fieldMapRet = parseFieldMap(fieldMap, { ...this.currentTreeNodeData, _route: this.$route.query })\r\n      const ret = await net[requestType.toLowerCase()](\r\n        url,\r\n        { ...params, ...fieldMapRet }\r\n      ).then(resp => {\r\n        const { data } = resp || {}\r\n        return data\r\n      })\r\n      return ret\r\n    },\r\n    async onChangePage (page, pageSize) {\r\n      this.tableData = await this.requestTableData({ currentPage: page, pageSize })\r\n    },\r\n    async requestTableData (props = {}) {\r\n      const { url, requestType = 'GET', page = {} } = this.tableMeta\r\n      this.tableQuerys = Object.assign(this.tableQuerys, { currentPage: this.tableQuerys.currentPage || 1, pageSize: this.tableQuerys.pageSize || 10 }, props)\r\n      this.$emit(RESERVE_EVENT_NAMES.WATCH, { ...this.exposed })\r\n      this.loading = true\r\n      const ret = await net[requestType.toLowerCase()](\r\n        url,\r\n        this.tableQuerys\r\n      ).then(resp => {\r\n        const { data = [], count } = resp || {}\r\n        this.total = count\r\n        this.loading = false\r\n        return (data || []).map(item => {\r\n          delete item.children\r\n          return {\r\n            key: uuidv4(),\r\n            ...item\r\n          }\r\n        })\r\n      })\r\n      this.cleanCurrentModelEffect(false) // 不清空 currentRowData，除非明确需要\r\n      this.tableData = ret\r\n      return ret\r\n    },\r\n    calculateTableHeight () {\r\n      const currentViewportHeight = window.innerHeight\r\n      const tableRef = this.$refs[this.tableRef]\r\n      const { top: tableToTop, width } = tableRef.$el.getBoundingClientRect()\r\n      this.tableWidth = width\r\n      this.tableHeight = currentViewportHeight - tableToTop - this.overHeight\r\n    },\r\n    calculateTreeHeight () {\r\n      if (!this.showTree) return\r\n      const modelTableContainerRef = this.$refs[this.modelTableContainerRef]\r\n      const { height } = modelTableContainerRef.getBoundingClientRect()\r\n      this.treeWrapperHeight = height\r\n    },\r\n    async keepAliveRefresh () {\r\n      // 重新计算表格高度（应对窗口大小变化）\r\n      this.$nextTick(() => {\r\n        this.calculateTableHeight()\r\n        if (this.showTree) {\r\n          this.calculateTreeHeight()\r\n        }\r\n      })\r\n      // 刷新列表数据\r\n      const { overrideInit = false } = this.tableMeta\r\n      if (overrideInit) {\r\n        // 如果使用自定义初始化模式，触发 INIT 事件\r\n        this.$emit(RESERVE_EVENT_NAMES.INIT, { ...this.exposed })\r\n      } else {\r\n        // 使用当前查询参数刷新表格数据\r\n        await this.requestTableData(this.tableQuerys)\r\n      }\r\n    }\r\n  },\r\n  mounted () {\r\n    this.calculateTableHeight()\r\n    this.$nextTick(() => {\r\n      this.calculateTreeHeight()\r\n    })\r\n    this.resizeObserverModelTableWrapper = new ResizeObserver(entries => {\r\n      for (const _ of entries) {\r\n        requestAnimationFrame(() => {\r\n          this.calculateTableHeight()\r\n        })\r\n      }\r\n    })\r\n    this.resizeObserverModelTableWrapper.observe(this.$refs[this.modelTableWrapper])\r\n  },\r\n  destroyed () {\r\n    this.resizeObserverModelTableWrapper.disconnect()\r\n    if (this.model) {\r\n      // 清理订阅\r\n      if (this.unsubscribe) {\r\n        this.unsubscribe()\r\n      }\r\n      if (this.unsubscribeShared) {\r\n        this.unsubscribeShared()\r\n      }\r\n      // 清理模型数据\r\n      if (this.model) {\r\n        this.model.cleanup()\r\n      }\r\n    }\r\n  },\r\n  async activated () {\r\n    await this.keepAliveRefresh()\r\n  }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.ele {\r\n  &.model__tree-table {\r\n    background: transparent;                                                                                                                                                                                                                 \r\n    display: flex;\r\n    flex-direction: row;\r\n    width: 100%;\r\n    .model__tree-table--container {\r\n      .model__tree--wrapper {\r\n        width: 240px;\r\n        background: #fff;\r\n        flex-shrink: 0;\r\n        padding: 16px;\r\n        box-sizing: border-box;\r\n        margin-right: 16px;\r\n        overflow-y: auto;\r\n      }\r\n    }\r\n    .model__table--container {\r\n      width: 100%;\r\n      min-width: 0;\r\n      background: #fff;\r\n      .model__table--title {\r\n        .model__table-title--bar {\r\n          width: 100%;\r\n          height: 8px;\r\n          background: var(--idooel-primary-color);\r\n          border-top-left-radius: 4px;\r\n          border-top-right-radius: 4px;\r\n        }\r\n        .model__table-title--text {\r\n          text-align: left;\r\n          padding: 16px;\r\n          font-size: 16px;\r\n          font-weight: bold;\r\n          background: #fff;\r\n          border-bottom: 1px solid;\r\n          border-color: var(--idoole-black-016);\r\n        }\r\n      }\r\n      .model__table--wrapper {\r\n        background: #fff;\r\n        .button-row__area {\r\n          width: 100%;\r\n          display: flex;\r\n          flex-direction: row;\r\n          align-items: center;\r\n          justify-content: space-between;\r\n          padding-top: 16px;\r\n          padding-bottom: 8px;\r\n          padding-right: 16px;\r\n        }\r\n        .g-table__wrapper {\r\n          .fsm {\r\n            cursor: pointer;\r\n            color: var(--idooel-primary-color);\r\n          }\r\n        }\r\n      }\r\n    }\r\n  }\r\n}\r\n</style>\r\n",".ele.model__tree-table {\n  background: transparent;\n  display: flex;\n  flex-direction: row;\n  width: 100%;\n}\n.ele.model__tree-table .model__tree-table--container .model__tree--wrapper {\n  width: 240px;\n  background: #fff;\n  flex-shrink: 0;\n  padding: 16px;\n  box-sizing: border-box;\n  margin-right: 16px;\n  overflow-y: auto;\n}\n.ele.model__tree-table .model__table--container {\n  width: 100%;\n  min-width: 0;\n  background: #fff;\n}\n.ele.model__tree-table .model__table--container .model__table--title .model__table-title--bar {\n  width: 100%;\n  height: 8px;\n  background: var(--idooel-primary-color);\n  border-top-left-radius: 4px;\n  border-top-right-radius: 4px;\n}\n.ele.model__tree-table .model__table--container .model__table--title .model__table-title--text {\n  text-align: left;\n  padding: 16px;\n  font-size: 16px;\n  font-weight: bold;\n  background: #fff;\n  border-bottom: 1px solid;\n  border-color: var(--idoole-black-016);\n}\n.ele.model__tree-table .model__table--container .model__table--wrapper {\n  background: #fff;\n}\n.ele.model__tree-table .model__table--container .model__table--wrapper .button-row__area {\n  width: 100%;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n  padding-top: 16px;\n  padding-bottom: 8px;\n  padding-right: 16px;\n}\n.ele.model__tree-table .model__table--container .model__table--wrapper .g-table__wrapper .fsm {\n  cursor: pointer;\n  color: var(--idooel-primary-color);\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined });
+      inject("data-v-46075027_0", { source: ".ele.model__tree-table[data-v-46075027] {\n  background: transparent;\n  display: flex;\n  flex-direction: row;\n  width: 100%;\n}\n.ele.model__tree-table .model__tree-table--container .model__tree--wrapper[data-v-46075027] {\n  width: 240px;\n  background: #fff;\n  flex-shrink: 0;\n  padding: 16px;\n  box-sizing: border-box;\n  margin-right: 16px;\n  overflow-y: auto;\n}\n.ele.model__tree-table .model__table--container[data-v-46075027] {\n  width: 100%;\n  min-width: 0;\n  background: #fff;\n}\n.ele.model__tree-table .model__table--container .model__table--title .model__table-title--bar[data-v-46075027] {\n  width: 100%;\n  height: 8px;\n  background: var(--idooel-primary-color);\n  border-top-left-radius: 4px;\n  border-top-right-radius: 4px;\n}\n.ele.model__tree-table .model__table--container .model__table--title .model__table-title--text[data-v-46075027] {\n  text-align: left;\n  padding: 16px;\n  font-size: 16px;\n  font-weight: bold;\n  background: #fff;\n  border-bottom: 1px solid;\n  border-color: var(--idoole-black-016);\n}\n.ele.model__tree-table .model__table--container .model__table--wrapper[data-v-46075027] {\n  background: #fff;\n}\n.ele.model__tree-table .model__table--container .model__table--wrapper .button-row__area[data-v-46075027] {\n  width: 100%;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n  padding-top: 16px;\n  padding-bottom: 8px;\n  padding-right: 16px;\n}\n.ele.model__tree-table .model__table--container .model__table--wrapper .g-table__wrapper .fsm[data-v-46075027] {\n  cursor: pointer;\n  color: var(--idooel-primary-color);\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["C:\\Users\\ZOU\\Code\\OnlineStudy\\base-elearning-frontend-model\\packages\\components\\packages\\models\\tree-table-model\\src\\index.vue","index.vue"],"names":[],"mappings":"AAiwBA;EACA,uBAAA;EACA,aAAA;EACA,mBAAA;EACA,WAAA;AChwBA;ADkwBA;EACA,YAAA;EACA,gBAAA;EACA,cAAA;EACA,aAAA;EACA,sBAAA;EACA,kBAAA;EACA,gBAAA;AChwBA;ADmwBA;EACA,WAAA;EACA,YAAA;EACA,gBAAA;ACjwBA;ADmwBA;EACA,WAAA;EACA,WAAA;EACA,uCAAA;EACA,2BAAA;EACA,4BAAA;ACjwBA;ADmwBA;EACA,gBAAA;EACA,aAAA;EACA,eAAA;EACA,iBAAA;EACA,gBAAA;EACA,wBAAA;EACA,qCAAA;ACjwBA;ADowBA;EACA,gBAAA;AClwBA;ADmwBA;EACA,WAAA;EACA,aAAA;EACA,mBAAA;EACA,mBAAA;EACA,8BAAA;EACA,iBAAA;EACA,mBAAA;EACA,mBAAA;ACjwBA;ADowBA;EACA,eAAA;EACA,kCAAA;AClwBA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["<template>\r\n  <section class=\"ele model__tree-table\">\r\n    <section class=\"model__tree-table--container\" v-if=\"showTree\">\r\n      <div class=\"model__tree--title\"></div>\r\n      <section :ref=\"modelTreeWrapper\" class=\"model__tree--wrapper\" :style=\"{height: `${treeWrapperHeight}px`}\">\r\n        <ele-tree\r\n          :tree-data=\"treeData\"\r\n          :defaultExpandedKeys=\"defaultExpandedKeys\"\r\n          :defaultSelectedKeys=\"defaultSelectedKeys\"\r\n          @select=\"selectTreeNode\"\r\n          :replace-fields=\"mapFields\">\r\n        </ele-tree>\r\n      </section>\r\n    </section>\r\n    <section class=\"model__table--container\" :ref=\"modelTableContainerRef\">\r\n      <div class=\"model__table--title\" v-if=\"title\">\r\n        <template v-if=\"titleMode\">\r\n          <div :class=\"[`model__table-title--${titleMode}`]\"></div>\r\n        </template>\r\n        <template v-else>\r\n          <div class=\"model__table-title--text\">{{ title }}</div>\r\n        </template>\r\n      </div>\r\n      <section :ref=\"modelTableWrapper\" class=\"model__table--wrapper\">\r\n        <ele-search-area :ref=\"searchArea\" @search=\"onSearch\" :data-source=\"searchMeta.elements\"></ele-search-area>\r\n        <div class=\"button-row__area\">\r\n          <ele-button-group class=\"model-table__button-group\" v-on=\"overrideButtonGroupEvent\" :ref=\"buttonGroup\" @click=\"handleClickButtonGroup\" :data-source=\"getButtonGroupElements\"></ele-button-group>\r\n          <slot name=\"tags\"></slot>\r\n          <slot v-if=\"$slots['sub-center']\" name=\"sub-center\"></slot>\r\n        </div>\r\n        <ele-table\r\n          v-on=\"overrideTableEvent\"\r\n          :ref=\"tableRef\"\r\n          :row-selection=\"rowSelection\"\r\n          :loading=\"loading\" \r\n          :columns=\"columns\"\r\n          :total=\"total\"\r\n          :x=\"x\"\r\n          :y=\"y\"\r\n          :bordered=\"setBorder\"\r\n          :height=\"tableHeight\"\r\n          :width=\"tableWidth\"\r\n          :actions=\"actions\"\r\n          :pageSize=\"pageSize\"\r\n          :pageSizeOptions=\"pageSizeOptions\"\r\n          :data-source=\"tableData\"\r\n          @change-page=\"onChangePage\"\r\n        ></ele-table>\r\n      </section>\r\n    </section>\r\n    <ele-modal-form v-model=\"modalFormValue\" v-on=\"overrideModalFormEvent\" :meta=\"modalFormMeta\"></ele-modal-form>\r\n    <ele-modal-fsm v-model=\"showFsmModal\" :contextProp=\"fsmContextProp\" :meta=\"fsmMeta\" @cancel=\"handleCloseFsmModal\"></ele-modal-fsm>\r\n    <ele-modal-table\r\n      :meta=\"modalTableMeta\"\r\n      v-model=\"modalTableValue\"\r\n      v-on=\"overrideModalTableEvent\"\r\n    ></ele-modal-table>\r\n  </section>\r\n</template>\r\n\r\n<script>\r\nimport { type, net } from '@idooel/shared'\r\nimport { v4 as uuidv4 } from 'uuid'\r\nimport { BUILT_IN_EVENT_NAMES, RESERVE_EVENT_NAMES, parseFieldMap, BUILT_IN_TRIGGER, CONTEXT } from '../../../utils'\r\nimport { createTreeTableModel } from '../../../utils/runtime-context'\r\nexport default {\r\n  name: 'ele-tree-table-model',\r\n  props: {\r\n    title: {\r\n      type: [Object, String]\r\n    },\r\n    overHeight: {\r\n      type: Number,\r\n      default: 0\r\n    },\r\n    treeMeta: {\r\n      type: Object,\r\n      default: () => ({})\r\n    },\r\n    searchMeta: {\r\n      type: Object,\r\n      default: () => ({})\r\n    },\r\n    buttonGroupMeta: {\r\n      typeof: Object,\r\n      default: () => ({})\r\n    },\r\n    tableMeta: {\r\n      type: Object,\r\n      default: () => ({})\r\n    },\r\n    createMeta: {\r\n      type: Object\r\n    },\r\n    editMeta: {\r\n      type: Object\r\n    }\r\n  },\r\n  provide () {\r\n    return {\r\n      requestTreeData: this.requestTreeData,\r\n      requestTableData: this.requestTableData,\r\n      keepAliveRefresh: this.keepAliveRefresh,\r\n      [CONTEXT]: () => {\r\n        return {\r\n          exposed: this.exposed\r\n        }\r\n      }\r\n    }\r\n  },\r\n  data () {\r\n    return {\r\n      tableHeight: 0,\r\n      tableWidth: 0,\r\n      modalFormMeta: {},\r\n      modalFormValue: false,\r\n      treeData: [],\r\n      tableData: [],\r\n      defaultExpandedKeys: [],\r\n      defaultSelectedKeys: [],\r\n      replaceFields: {\r\n        title: 'title',\r\n        children: 'children',\r\n        key: 'id'\r\n      },\r\n      loading: false,\r\n      total: 0,\r\n      tableQuerys: {},\r\n      resizeObserverModelTableWrapper: null,\r\n      modelTableWrapperHeight: 0,\r\n      currentTreeNodeData: {},\r\n      currentRowData: {},\r\n      treeWrapperHeight: 0,\r\n      currentTableSelection: this.currentTableMode == 'radio' ? {} : [],\r\n      showFsmModal: false,\r\n      fsmMeta: {},\r\n      fsmContextProp: {},\r\n      modalTableValue: false,\r\n      modalTableMeta: {},\r\n      dataPoolManager: null\r\n    }\r\n  },\r\n  computed: {\r\n    setBorder () {\r\n      return this.tableMeta.bordered === false ? false : true\r\n    },\r\n    rowSelection () {\r\n      if (!this.currentTableMode) return void 0\r\n      return {\r\n        columnTitle: this.currentSelectionColumn.columnTitle,\r\n        fixed: true,\r\n        type: this.currentTableMode,\r\n        onChange: this.onChangeTableSelection\r\n      }\r\n    },\r\n    currentSelectionColumn () {\r\n      const { multiple } = this.tableMeta\r\n      const target = this.columns.find(item => Object.keys(item).includes('multiple'))\r\n      const isGlobalExistMultiple = Object.keys(this.tableMeta).includes('multiple')\r\n      if (target) {\r\n        return target\r\n      } else if (isGlobalExistMultiple) {\r\n        return { multiple }\r\n      }\r\n      return void 0\r\n    },\r\n    x () {\r\n      const { x } = this.tableMeta\r\n      return x\r\n    },\r\n    y () {\r\n      const { y } = this.tableMeta\r\n      return y\r\n    },\r\n    currentTableMode () {\r\n      if (!this.currentSelectionColumn) return void 0\r\n      const { multiple } = this.currentSelectionColumn\r\n      if (type.isBool(multiple)) {\r\n        if (multiple) {\r\n          return 'checkbox'\r\n        } else {\r\n          return 'radio'\r\n        }\r\n      } else {\r\n        return void 0\r\n      }\r\n    },\r\n    modelTableContainerRef () {\r\n      return uuidv4()\r\n    },\r\n    titleMode () {\r\n      if (type.isObject(this.title)) {\r\n        const { mode = '' } = this.title\r\n        return mode\r\n      }\r\n      return void 0\r\n    },\r\n    tableRef () {\r\n      return uuidv4()\r\n    },\r\n    exposed () {\r\n      return {\r\n        showModalForm: this.showModalForm,\r\n        closeModalForm: this.closeModalForm,\r\n        showModalTable: this.showModalTable,\r\n        closeModalTable: this.closeModalTable,\r\n        currentTableSelection: this.currentTableSelection,\r\n        currentTreeNode: this.currentTreeNodeData,\r\n        requestTableData: this.requestTableData,\r\n        keepAliveRefresh: this.keepAliveRefresh,\r\n        refreshTreeData: this.refreshTreeData,\r\n        querys: this.tableQuerys,\r\n        currentRowData: this.getCurrentRowData(),\r\n        getCurrentRowData: this.getCurrentRowData,\r\n        setCurrentRowData: this.setCurrentRowData,\r\n        setCurrentTableSelection: this.setCurrentTableSelection,\r\n        getCurrentTableSelection: this.getCurrentTableSelection,\r\n        cleanCurrentModelEffect: this.cleanCurrentModelEffect,\r\n        route: this.$route,\r\n        _route: this.$route.query,\r\n        _routeMeta: this.$route.meta,\r\n        dataPool: this.model ? this.model.getDataPool() : null,\r\n        dataPoolManager: this.model || null\r\n      }\r\n    },\r\n    overrideTableEvent () {\r\n      const events = this.actions.reduce((ret, action) => {\r\n        ret[action.eventName || action.key] = (e) => {\r\n          this.setCurrentRowData(e.exposed.currentRowData)\r\n          const { target } = action\r\n          const targetMeta = this.findMetaByKey(target)\r\n          const { mode } = targetMeta\r\n          mode && this.dispatchTrigger({ mode, record: e.exposed.currentRowData, modeMeta: targetMeta })\r\n          this.$emit(action.eventName || action.key, { ...e, currentTreeNode: this.currentTreeNodeData, exposed: { ...this.exposed, ...e.exposed } })\r\n        }\r\n        return ret\r\n      }, {})\r\n      return {\r\n        ...this.$listeners,\r\n        ...events,\r\n        [BUILT_IN_EVENT_NAMES.EDIT]: this[BUILT_IN_EVENT_NAMES.EDIT],\r\n        [BUILT_IN_EVENT_NAMES.SUBMIT]: this[BUILT_IN_EVENT_NAMES.SUBMIT]\r\n      }\r\n    },\r\n    overrideModalFormEvent () {\r\n      const { footerMeta } = this.modalFormMeta\r\n      const { elements = [] } = footerMeta || {}\r\n      const eles = type.isFunction(elements) ? elements.call(this) : elements\r\n      const events = eles.reduce((ret, ele) => {\r\n        ret[ele.eventName] = (e = {}) => {\r\n          if (ele.eventName === 'cancel') {\r\n            this.closeModalForm()\r\n          } else {\r\n            const { exposed = {} } = e\r\n            this.$emit(`${ele.eventName || ele.key}`, { ...e, currentTreeNode: this.currentTreeNodeData, exposed: Object.assign({}, exposed )})\r\n          }\r\n        }\r\n        return ret\r\n      }, {})\r\n      return {\r\n        ...events\r\n      }\r\n    },\r\n    overrideModalTableEvent () {\r\n      const { footerMeta } = this.modalTableMeta\r\n      const { elements = [] } = footerMeta || {}\r\n      const eles = type.isFunction(elements) ? elements.call(this) : elements\r\n      const events = eles.reduce((ret, ele) => {\r\n        ret[ele.eventName] = (e = {}) => {\r\n          if (ele.eventName === 'cancel') {\r\n            this.closeModalTable()\r\n          } else {\r\n            const { exposed = {} } = e\r\n            this.$emit(`${ele.eventName || ele.key}`, { ...e, currentTreeNode: this.currentTreeNodeData, exposed: Object.assign({}, exposed )})\r\n          }\r\n        }\r\n        return ret\r\n      }, {})\r\n      return {\r\n        ...events,\r\n        exposed: this.exposed\r\n      }\r\n    },\r\n    overrideButtonGroupEvent () {\r\n      const events = this.getButtonGroupElements.reduce((ret, ele) => {\r\n        ret[ele.eventName] = (e) => {\r\n          this.$emit(ele.eventName || 'click', { ...e, currentTreeNode: this.currentTreeNodeData, exposed: Object.assign({}, e.exposed || {}, this.exposed)})\r\n        }\r\n        return ret\r\n      }, {})\r\n      return {\r\n        ...this.$listeners,\r\n        ...events,\r\n        [BUILT_IN_EVENT_NAMES.CREATE]: this[BUILT_IN_EVENT_NAMES.CREATE],\r\n        exposed: this.exposed\r\n      }\r\n    },\r\n    showTree () {\r\n      return !!Object.keys(this.treeMeta).length\r\n    },\r\n    buttonGroup () {\r\n      return uuidv4()\r\n    },\r\n    searchArea () {\r\n      return uuidv4()\r\n    },\r\n    modelTreeWrapper () {\r\n      return uuidv4()\r\n    },\r\n    modelTableWrapper () {\r\n      return uuidv4()\r\n    },\r\n    actions () {\r\n      const { operations } = this.tableMeta\r\n      if (operations) {\r\n        return operations.elements\r\n      } else {\r\n        return []\r\n      }\r\n    },\r\n    pageSize () {\r\n      const { page = {} } = this.tableMeta\r\n      return page.pageSize || 10\r\n    },\r\n    pageSizeOptions () {\r\n      const { page = {} } = this.tableMeta\r\n      return page.pageSizeOptions || ['10', '20', '30', '40']\r\n    },\r\n    columns () {\r\n      const { columns, operations } = this.tableMeta\r\n      if (type.get(columns) === 'array') {\r\n        const columnsOptions = columns.map(item => {\r\n          const { mode = 'text' } = item\r\n          if (item.render) {\r\n            return {\r\n              ...item,\r\n              customRender: (text, record, index) => {\r\n                const { $createElement } = this\r\n                return item.render.call(this, \r\n                  { h: $createElement, ctx: this },\r\n                  text ? typeof text == 'object' ? text[item.dataIndex] : text : '', \r\n                  record, index)\r\n              }\r\n            }\r\n          } else if (mode !== BUILT_IN_TRIGGER.TEXT) {\r\n            const { [`${mode}Meta`]: modeMeta } = item\r\n            return {\r\n              ...item,\r\n              customRender: (text, record, index) => {\r\n                return <span onClick={() => this.dispatchTrigger({ mode, record, modeMeta, index })} class={ mode }>{ text }</span>\r\n              }\r\n            }\r\n          }\r\n          return {\r\n            ...item\r\n          }\r\n        })\r\n        if (operations) {\r\n          return [\r\n            ...columnsOptions,\r\n            {\r\n              title: '操作',\r\n              width: operations.width,\r\n              key: 'action',\r\n              fixed: 'right',\r\n              scopedSlots: { customRender: 'action' }\r\n            }\r\n          ]\r\n        }\r\n        return columnsOptions\r\n      } else {\r\n        console.error('Error: columns is invalid, please check it')\r\n        return []\r\n      }\r\n    },\r\n    getButtonGroupElements () {\r\n      const { elements } = this.buttonGroupMeta\r\n      if (type.get(elements) === 'function') {\r\n        return elements.call(this)\r\n      } else if (type.get(elements) === 'array') {\r\n        return elements\r\n      } else {\r\n        return []\r\n      }\r\n    },\r\n    mapFields () {\r\n      const { replaceFields = {} } = this.treeMeta\r\n      const mapFields = type.isEmpty(replaceFields) ? this.replaceFields : replaceFields\r\n      return mapFields\r\n    }\r\n  },\r\n  async created () {\r\n    // onSearch会初始化请求表格数据，所以不需要在这里请求表格数据\r\n    // 确保全局数据池已初始化\r\n    if (!window.__idooel_data_pool__) {\r\n      console.error('Global data pool not initialized. Please check if runtime-context/globalDataPool.js is properly imported.')\r\n      return\r\n    }\r\n    \r\n    // 初始化数据池管理器（使用新的 runtime-context）\r\n    try {\r\n      this.model = createTreeTableModel('treeTableModel')\r\n      \r\n      if (!this.model) {\r\n        throw new Error('Failed to create tree table model')\r\n      }\r\n    } catch (error) {\r\n      console.error('Error creating tree table model:', error)\r\n      this.model = null\r\n      return\r\n    }\r\n    \r\n    // 初始化 currentRowData（尝试从共享命名空间获取）\r\n    this.initializeCurrentRowData()\r\n    \r\n    // 订阅数据池变化\r\n    this.unsubscribe = this.model.subscribe('currentRowData', (event) => {\r\n      this.currentRowData = event.value || {}\r\n      this.$forceUpdate()\r\n    })\r\n    \r\n    // 订阅共享数据变化\r\n    this.unsubscribeShared = this.model.subscribeShared((event) => {\r\n      // 当有新的共享数据时，更新当前组件的 currentRowData\r\n      if (event.value && Object.keys(event.value).length > 0) {\r\n        this.setCurrentRowData(event.value)\r\n      }\r\n    })\r\n    \r\n    if (this.showTree) {\r\n      this.treeData = await this.requestTreeData()\r\n      const [defaultTreeNode = {}] = this.treeData\r\n      this.defaultExpandedKeys = [defaultTreeNode[this.mapFields.key]]\r\n      this.defaultSelectedKeys = [defaultTreeNode[this.mapFields.key]]\r\n      this.currentTreeNodeData = defaultTreeNode\r\n      const { params = {}, fieldMap = {}, overrideInit = false } = this.tableMeta\r\n      const currentRowData = this.getCurrentRowData()\r\n      const ctx = { \r\n        ...this.currentTreeNodeData, \r\n        _route: this.$route.query, \r\n        currentRowData: currentRowData\r\n      }\r\n      \r\n      const initQuerys = Object.assign({}, params, parseFieldMap(fieldMap, ctx))\r\n      if (overrideInit) {\r\n        this.$emit(RESERVE_EVENT_NAMES.INIT, { ...this.exposed })\r\n      } else {\r\n        this.tableData = await this.requestTableData(initQuerys)\r\n      }\r\n    }\r\n  },\r\n  methods: {\r\n    initializeCurrentRowData () {\r\n      if (!this.model) {\r\n        console.warn('Model not initialized, skipping currentRowData initialization')\r\n        return\r\n      }\r\n      \r\n      // 检查是否有来自父组件的共享数据（比如 modal table 场景）\r\n      const parentData = this.model.getSharedData()\r\n      \r\n      if (parentData && Object.keys(parentData).length > 0) {\r\n        this.setCurrentRowData(parentData)\r\n        return\r\n      }\r\n      \r\n      // 可以根据路由参数、props 或其他来源设置初始的 currentRowData\r\n      const { query } = this.$route\r\n      \r\n      // 示例：如果路由中有特定参数，可以设置为 currentRowData\r\n      if (query.rowId || query.selectedId) {\r\n        // 这里可以根据实际需求从服务端或其他地方获取数据\r\n        // const presetData = { id: query.rowId, /* 其他字段 */ }\r\n        // this.setCurrentRowData(presetData)\r\n      }\r\n      \r\n      // 目前保持空对象，等待用户选择行数据\r\n    },\r\n    async refreshTreeData () {\r\n      this.treeData = await this.requestTreeData()\r\n      const [defaultTreeNode = {}] = this.treeData\r\n      this.defaultExpandedKeys = [defaultTreeNode[this.mapFields.key]]\r\n      this.defaultSelectedKeys = [defaultTreeNode[this.mapFields.key]]\r\n      this.currentTreeNodeData = defaultTreeNode\r\n    },\r\n    dispatchTrigger ({ mode, record = {}, modeMeta = { } }) {\r\n      switch (mode) {\r\n        case BUILT_IN_TRIGGER.FSM:\r\n          this[`${BUILT_IN_TRIGGER.FSM}Trigger`](record, modeMeta = type.isEmpty(modeMeta) ? { \r\n            url: 'api-fsm/workbench/fsm/auditFlow',\r\n            requestType: 'GET',\r\n            fieldMap: {\r\n              modelCode: 'modelCode',\r\n              businessId: 'businessId'\r\n            }\r\n          } : modeMeta)\r\n          break\r\n        case BUILT_IN_TRIGGER.ELE_MODAL_FORM:\r\n          this.modalFormMeta = modeMeta\r\n          this.showModalForm(modeMeta)\r\n          break\r\n        case BUILT_IN_TRIGGER.ELE_MODAL_TABLE:\r\n          this.modalTableMeta = modeMeta\r\n          // 将当前行的 record 数据传递给 modal table\r\n          this.showModalTable(modeMeta, record)\r\n          break\r\n        default:\r\n          break\r\n      }\r\n    },\r\n    handleCloseFsmModal () {\r\n      this.showFsmModal = false\r\n    },\r\n    [`${BUILT_IN_TRIGGER.FSM}Trigger`] (record, meta) {\r\n      this.fsmMeta = meta\r\n      this.fsmContextProp = record\r\n      this.showFsmModal = true\r\n    },\r\n    onChangeTableSelection (_, selectedRows = []) {\r\n      if (this.currentTableMode === 'radio') {\r\n        this.setCurrentTableSelection(selectedRows)\r\n        this.$emit('on-change-table-selection', this.currentTableSelection)\r\n        this.$emit('x:refresh-exposed', { exposed: this.exposed })\r\n      } else {\r\n        this.setCurrentTableSelection(selectedRows)\r\n        this.$emit('on-change-table-selection', this.currentTableSelection)\r\n        this.$emit('x:refresh-exposed', { exposed: this.exposed })\r\n      }\r\n    },\r\n    setCurrentTableSelection (props = {}) {\r\n      if (this.currentTableMode === 'radio') {\r\n        this.$set(this, 'currentTableSelection', (type.isArray(props) && props.length > 0) ? props[0] : type.isObject(props) ? props : {})\r\n      } else {\r\n        this.$set(this, 'currentTableSelection', type.isArray(props) ? props : [])\r\n      }\r\n    },\r\n    getCurrentTableSelection () {\r\n      return this.currentTableSelection\r\n    },\r\n    setCurrentRowData (props = {}) {\r\n      this.currentRowData = props\r\n      if (this.model) {\r\n        this.model.setCurrentRowData(props)\r\n      } else {\r\n        console.warn('Model not initialized, cannot setCurrentRowData in model')\r\n      }\r\n    },\r\n    getCurrentRowData () {\r\n      if (this.model) {\r\n        return this.model.getCurrentRowData()\r\n      }\r\n      console.warn('Model not initialized, getCurrentRowData returning local data')\r\n      return this.currentRowData || {}\r\n    },\r\n    cleanCurrentModelEffect (clearRowData = true) {\r\n      this.setCurrentTableSelection()\r\n      if (clearRowData) {\r\n        this.setCurrentRowData({})\r\n      }\r\n    },\r\n    [BUILT_IN_EVENT_NAMES.SUBMIT] (props = {}) {\r\n      this.cleanCurrentModelEffect()\r\n      this.requestTableData()\r\n    },\r\n    [BUILT_IN_EVENT_NAMES.EDIT] (props = {}) {\r\n      const { record = {} } = props\r\n      this.setCurrentRowData(record)\r\n      this.modalFormMeta = this.editMeta\r\n      this.modalFormValue = true\r\n    },\r\n    [BUILT_IN_EVENT_NAMES.CREATE] () {\r\n      this.modalFormMeta = this.createMeta\r\n      this.modalFormValue = true\r\n    },\r\n    showModalForm (modeMeta = {}) {\r\n      if (type.isStr(modeMeta)) {\r\n        const targetMeta = this.findMetaByKey(modeMeta)\r\n        this.modalFormMeta = targetMeta\r\n      } else {\r\n        this.modalFormMeta = modeMeta\r\n      }\r\n      this.modalFormValue = true\r\n    },\r\n    showModalTable (modeMeta = {}, record = null) {\r\n      // 获取当前行数据并设置到共享命名空间\r\n      const currentRowData = record || this.getCurrentRowData()\r\n      if (this.model) {\r\n        this.model.setSharedData(currentRowData)\r\n      } else {\r\n        console.warn('Model not initialized, cannot setSharedData')\r\n      }\r\n      \r\n      let targetMeta = modeMeta\r\n      if (type.isStr(modeMeta)) {\r\n        targetMeta = this.findMetaByKey(modeMeta)\r\n      }\r\n      \r\n      // 解析 fieldMap 参数，使用完整的上下文包括 currentRowData\r\n      if (targetMeta && targetMeta.fieldMap) {\r\n        const { fieldMap, params = {} } = targetMeta\r\n        \r\n        const ctx = { \r\n          ...this.currentTreeNodeData, \r\n          _route: this.$route.query, \r\n          ...currentRowData \r\n        }\r\n        const parsedParams = parseFieldMap(fieldMap, ctx)\r\n        \r\n        // 将当前的 currentRowData 传递给 modal table，通过 params\r\n        targetMeta = {\r\n          ...targetMeta,\r\n          params: {\r\n            ...params,\r\n            ...parsedParams\r\n          }\r\n        }\r\n      }\r\n      \r\n      this.modalTableMeta = targetMeta\r\n      this.modalTableValue = true\r\n    },\r\n    closeModalForm () {\r\n      this.modalFormValue = false\r\n    },\r\n    closeModalTable () {\r\n      this.modalTableValue = false\r\n    },\r\n    findMetaByKey (key) {\r\n      return this.$attrs[key] || {}\r\n    },\r\n    handleClickButtonGroup (props) {\r\n      const { eventName, target } = props\r\n      const targetMeta = this.findMetaByKey(target)\r\n      const { mode } = targetMeta\r\n      mode && this.dispatchTrigger({ mode, modeMeta: targetMeta })\r\n      this.$emit(eventName || 'click', { currentTreeNode: this.currentTreeNodeData })\r\n    },\r\n    async onSearch (props) {\r\n      const { overrideInit = false } = this.tableMeta\r\n      this.tableQuerys = Object.assign(this.tableQuerys, props)\r\n      if (overrideInit) {\r\n        this.$emit(RESERVE_EVENT_NAMES.TREE_CHANGE, { ...this.exposed })\r\n      } else {\r\n        const { initSearch = false } = props\r\n        if (this.showTree && initSearch) return\r\n        this.tableData = await this.requestTableData()\r\n      }\r\n    },\r\n    async selectTreeNode (selectedKeys, e) {\r\n      const { fieldMap } = this.tableMeta\r\n      this.currentTreeNodeData = e.node.$vnode.data.props.dataRef || {}\r\n      //@deprecated '_' namespace is deprecated, please use 'exposed' instead\r\n      const execFieldMapRet = parseFieldMap(fieldMap, { ...this.currentTreeNodeData, exposed: this.exposed, _route: this.exposed._route })\r\n      const { overrideInit = false } = this.tableMeta\r\n      if (overrideInit) {\r\n        this.$emit(RESERVE_EVENT_NAMES.TREE_CHANGE, { ...this.exposed })\r\n      } else {\r\n        this.tableData = await this.requestTableData(execFieldMapRet)\r\n      }\r\n    },\r\n    async requestTreeData () {\r\n      const { url, requestType = 'GET', params = {}, fieldMap = {} } = this.treeMeta\r\n      const fieldMapRet = parseFieldMap(fieldMap, { ...this.currentTreeNodeData, _route: this.$route.query })\r\n      const ret = await net[requestType.toLowerCase()](\r\n        url,\r\n        { ...params, ...fieldMapRet }\r\n      ).then(resp => {\r\n        const { data } = resp || {}\r\n        return data\r\n      })\r\n      return ret\r\n    },\r\n    async onChangePage (page, pageSize) {\r\n      this.tableData = await this.requestTableData({ currentPage: page, pageSize })\r\n    },\r\n    async requestTableData (props = {}) {\r\n      const { url, requestType = 'GET', page = {} } = this.tableMeta\r\n      this.tableQuerys = Object.assign(this.tableQuerys, { currentPage: this.tableQuerys.currentPage || 1, pageSize: this.tableQuerys.pageSize || 10 }, props)\r\n      this.$emit(RESERVE_EVENT_NAMES.WATCH, { ...this.exposed })\r\n      this.loading = true\r\n      const ret = await net[requestType.toLowerCase()](\r\n        url,\r\n        this.tableQuerys\r\n      ).then(resp => {\r\n        const { data = [], count } = resp || {}\r\n        this.total = count\r\n        this.loading = false\r\n        return (data || []).map(item => {\r\n          delete item.children\r\n          return {\r\n            key: uuidv4(),\r\n            ...item\r\n          }\r\n        })\r\n      })\r\n      this.cleanCurrentModelEffect(false) // 不清空 currentRowData，除非明确需要\r\n      this.tableData = ret\r\n      return ret\r\n    },\r\n    calculateTableHeight () {\r\n      const currentViewportHeight = window.innerHeight\r\n      const tableRef = this.$refs[this.tableRef]\r\n      const { top: tableToTop, width } = tableRef.$el.getBoundingClientRect()\r\n      this.tableWidth = width\r\n      this.tableHeight = currentViewportHeight - tableToTop - this.overHeight\r\n    },\r\n    calculateTreeHeight () {\r\n      if (!this.showTree) return\r\n      const modelTableContainerRef = this.$refs[this.modelTableContainerRef]\r\n      const { height } = modelTableContainerRef.getBoundingClientRect()\r\n      this.treeWrapperHeight = height\r\n    },\r\n    async keepAliveRefresh () {\r\n      // 重新计算表格高度（应对窗口大小变化）\r\n      this.$nextTick(() => {\r\n        this.calculateTableHeight()\r\n        if (this.showTree) {\r\n          this.calculateTreeHeight()\r\n        }\r\n      })\r\n      // 刷新列表数据\r\n      const { overrideInit = false } = this.tableMeta\r\n      if (overrideInit) {\r\n        // 如果使用自定义初始化模式，触发 INIT 事件\r\n        this.$emit(RESERVE_EVENT_NAMES.INIT, { ...this.exposed })\r\n      } else {\r\n        // 使用当前查询参数刷新表格数据\r\n        await this.requestTableData(this.tableQuerys)\r\n      }\r\n    }\r\n  },\r\n  mounted () {\r\n    this.calculateTableHeight()\r\n    this.$nextTick(() => {\r\n      this.calculateTreeHeight()\r\n    })\r\n    this.resizeObserverModelTableWrapper = new ResizeObserver(entries => {\r\n      for (const _ of entries) {\r\n        requestAnimationFrame(() => {\r\n          this.calculateTableHeight()\r\n        })\r\n      }\r\n    })\r\n    this.resizeObserverModelTableWrapper.observe(this.$refs[this.modelTableWrapper])\r\n  },\r\n  destroyed () {\r\n    this.resizeObserverModelTableWrapper.disconnect()\r\n    if (this.model) {\r\n      // 清理订阅\r\n      if (this.unsubscribe) {\r\n        this.unsubscribe()\r\n      }\r\n      if (this.unsubscribeShared) {\r\n        this.unsubscribeShared()\r\n      }\r\n      // 清理模型数据\r\n      if (this.model) {\r\n        this.model.cleanup()\r\n      }\r\n    }\r\n  },\r\n  async activated () {\r\n    await this.keepAliveRefresh()\r\n  }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.ele {\r\n  &.model__tree-table {\r\n    background: transparent;                                                                                                                                                                                                                 \r\n    display: flex;\r\n    flex-direction: row;\r\n    width: 100%;\r\n    .model__tree-table--container {\r\n      .model__tree--wrapper {\r\n        width: 240px;\r\n        background: #fff;\r\n        flex-shrink: 0;\r\n        padding: 16px;\r\n        box-sizing: border-box;\r\n        margin-right: 16px;\r\n        overflow-y: auto;\r\n      }\r\n    }\r\n    .model__table--container {\r\n      width: 100%;\r\n      min-width: 0;\r\n      background: #fff;\r\n      .model__table--title {\r\n        .model__table-title--bar {\r\n          width: 100%;\r\n          height: 8px;\r\n          background: var(--idooel-primary-color);\r\n          border-top-left-radius: 4px;\r\n          border-top-right-radius: 4px;\r\n        }\r\n        .model__table-title--text {\r\n          text-align: left;\r\n          padding: 16px;\r\n          font-size: 16px;\r\n          font-weight: bold;\r\n          background: #fff;\r\n          border-bottom: 1px solid;\r\n          border-color: var(--idoole-black-016);\r\n        }\r\n      }\r\n      .model__table--wrapper {\r\n        background: #fff;\r\n        .button-row__area {\r\n          width: 100%;\r\n          display: flex;\r\n          flex-direction: row;\r\n          align-items: center;\r\n          justify-content: space-between;\r\n          padding-top: 16px;\r\n          padding-bottom: 8px;\r\n          padding-right: 16px;\r\n        }\r\n        .g-table__wrapper {\r\n          .fsm {\r\n            cursor: pointer;\r\n            color: var(--idooel-primary-color);\r\n          }\r\n        }\r\n      }\r\n    }\r\n  }\r\n}\r\n</style>\r\n",".ele.model__tree-table {\n  background: transparent;\n  display: flex;\n  flex-direction: row;\n  width: 100%;\n}\n.ele.model__tree-table .model__tree-table--container .model__tree--wrapper {\n  width: 240px;\n  background: #fff;\n  flex-shrink: 0;\n  padding: 16px;\n  box-sizing: border-box;\n  margin-right: 16px;\n  overflow-y: auto;\n}\n.ele.model__tree-table .model__table--container {\n  width: 100%;\n  min-width: 0;\n  background: #fff;\n}\n.ele.model__tree-table .model__table--container .model__table--title .model__table-title--bar {\n  width: 100%;\n  height: 8px;\n  background: var(--idooel-primary-color);\n  border-top-left-radius: 4px;\n  border-top-right-radius: 4px;\n}\n.ele.model__tree-table .model__table--container .model__table--title .model__table-title--text {\n  text-align: left;\n  padding: 16px;\n  font-size: 16px;\n  font-weight: bold;\n  background: #fff;\n  border-bottom: 1px solid;\n  border-color: var(--idoole-black-016);\n}\n.ele.model__tree-table .model__table--container .model__table--wrapper {\n  background: #fff;\n}\n.ele.model__tree-table .model__table--container .model__table--wrapper .button-row__area {\n  width: 100%;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n  padding-top: 16px;\n  padding-bottom: 8px;\n  padding-right: 16px;\n}\n.ele.model__tree-table .model__table--container .model__table--wrapper .g-table__wrapper .fsm {\n  cursor: pointer;\n  color: var(--idooel-primary-color);\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined });
 
     };
     /* scoped */
-    const __vue_scope_id__$A = "data-v-6e8ad2fe";
+    const __vue_scope_id__$A = "data-v-46075027";
     /* module identifier */
     const __vue_module_identifier__$A = undefined;
     /* functional template */
@@ -12922,7 +12925,10 @@
     },
     created() {
       const querys = this.extractValues();
-      this.$emit('search', querys);
+      this.$emit('search', {
+        ...querys,
+        initSearch: true
+      });
     },
     methods: {
       controlDisplayByFormula(dataSource = []) {
@@ -13245,11 +13251,11 @@
     /* style */
     const __vue_inject_styles__$b = function (inject) {
       if (!inject) return
-      inject("data-v-77b7e5ba_0", { source: ".search-area__wrapper[data-v-77b7e5ba] {\n  padding-top: 16px;\n  padding-left: 16px;\n  padding-right: 16px;\n}\n.search-area__wrapper[data-v-77b7e5ba]  .ant-col:last-child {\n  float: right;\n}\n.search-area__wrapper .search-area__item[data-v-77b7e5ba] {\n  height: 32px;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n}\n.search-area__wrapper .search-area__item.search-area--action[data-v-77b7e5ba] {\n  justify-content: end;\n}\n.search-area__wrapper .search-area__item .expand-collapse[data-v-77b7e5ba] {\n  margin-left: 8px;\n  height: 32px;\n  padding: 4px 16px;\n  color: var(--idooel-primary-color);\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n}\n.search-area__wrapper .search-area__item .expand-collapse .expand-collapse__text[data-v-77b7e5ba] {\n  font-size: 14px;\n}\n.search-area__wrapper .search-area__item .expand-collapse .expand-collapse__icon[data-v-77b7e5ba] {\n  font-size: 16px;\n  margin-left: 8px;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["C:\\Users\\ZOU\\Code\\OnlineStudy\\base-elearning-frontend-model\\packages\\components\\packages\\composite-components\\search-area\\src\\index.vue","index.vue"],"names":[],"mappings":"AAyMA;EACA,iBAAA;EACA,kBAAA;EACA,mBAAA;ACxMA;AD0MA;EACA,YAAA;ACxMA;AD2MA;EACA,YAAA;EACA,aAAA;EACA,mBAAA;EACA,mBAAA;ACzMA;AD0MA;EACA,oBAAA;ACxMA;AD0MA;EACA,gBAAA;EACA,YAAA;EACA,iBAAA;EACA,kCAAA;EACA,aAAA;EACA,mBAAA;EACA,mBAAA;EACA,uBAAA;EACA,eAAA;ACxMA;ADyMA;EACA,eAAA;ACvMA;ADyMA;EACA,eAAA;EACA,gBAAA;ACvMA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["<template>\r\n  <div class=\"search-area__wrapper\">\r\n    <a-row :gutter=\"gutter\">\r\n      <template v-for=\"(item, idx) in innerDataSource\">\r\n        <a-col v-if=\"item._show\" :span=\"item.span || span\" :key=\"idx\">\r\n          <div v-if=\"item.type == '_action'\" class=\"search-area__item search-area--action\">\r\n            <ele-button icon=\"search\" type=\"primary\" @click=\"handleClickSearch\">查询</ele-button>\r\n            <ele-button style=\"margin-left:8px;\" icon=\"reload\" @click=\"handleClickReset\">重置</ele-button>\r\n            <div v-if=\"innerDataSource.length > cuttingFormula + 1\" class=\"expand-collapse\" @click=\"handleClickExpandCollapse\">\r\n              <span class=\"expand-collapse__text\">{{ isExpand ? '收起' : '展开' }}</span>\r\n              <span class=\"expand-collapse__icon\">\r\n                <a-icon v-if=\"isExpand\" type=\"up\" />\r\n                <a-icon v-else type=\"down\" />\r\n              </span>\r\n            </div>\r\n          </div>\r\n          <div v-else class=\"search-area__item\">\r\n            <template v-if=\"(item.type == 'ele-input') || (item.type == 'Input')\">\r\n              <Label :label=\"item.label\"></Label>\r\n              <ele-input v-model=\"item._value\"></ele-input>\r\n            </template>\r\n            <template v-else-if=\"(item.type == 'ele-select') || (item.type == 'Select')\">\r\n              <Label :label=\"item.label\"></Label>\r\n              <ele-select v-model=\"item._value\" :init=\"item.init\" :mode=\"item.mode\" :code=\"item.code\" :params=\"item.params\" :url=\"item.url\" :multiple=\"item.multiple\" :data-source=\"item.optionList\"></ele-select>\r\n            </template>\r\n            <template v-else-if=\"(item.type == 'ele-date') || (item.type == 'DatePicker')\">\r\n              <Label :label=\"item.label\"></Label>\r\n              <ele-date v-model=\"item._value\" :placeholder=\"item.placeholder\" :format=\"item.format\"></ele-date>\r\n            </template>\r\n            <template v-else-if=\"item.type == 'ele-date-range'\">\r\n              <Label :label=\"item.label\"></Label>\r\n              <ele-date-range v-model=\"item._value\" :format=\"item.format\" :show-time=\"item.showTime\"></ele-date-range>\r\n            </template>\r\n          </div>\r\n        </a-col>\r\n      </template>\r\n    </a-row>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport Label from './label.vue'\r\nimport moment from 'moment'\r\nimport { parse } from '@idooel/expression'\r\nimport { type } from '@idooel/shared'\r\nexport default {\r\n  name: 'ele-search-area',\r\n  components: {\r\n    Label\r\n  },\r\n  props: {\r\n    gutter: {\r\n      type: [Number, Array, Object],\r\n      default: () => ([\r\n        16, 8\r\n      ])\r\n    },\r\n    span: {\r\n      type: Number,\r\n      default: 8\r\n    },\r\n    dataSource: {\r\n      type: Array,\r\n      required: true\r\n    }\r\n  },\r\n  data() {\r\n    return {\r\n      isExpand: false\r\n    }\r\n  },\r\n  computed: {\r\n    cuttingFormula () {\r\n      return (24 / this.span - 1)\r\n    },\r\n    buildDataSource () {\r\n      return this.controlDisplayByFormula(this.mapDefaultValueToValue())\r\n    },\r\n    innerDataSource () {\r\n      return [ ...this.buildDataSource, { type: '_action', _show: true }]\r\n    }\r\n  },\r\n  created() {\r\n    const querys = this.extractValues()\r\n    this.$emit('search', querys)\r\n  },\r\n  methods: {\r\n    controlDisplayByFormula (dataSource = []) {\r\n      if (this.isExpand) {\r\n        dataSource.forEach(item => {\r\n          this.$set(item, '_show', true)\r\n        })\r\n      } else {\r\n        dataSource.forEach((item, idx) => {\r\n          if (idx < this.cuttingFormula) {\r\n            this.$set(item, '_show', true)\r\n          } else {\r\n            this.$set(item, '_show', false)\r\n          }\r\n        })\r\n      }\r\n      return dataSource\r\n    },\r\n    buildDefaultValue (arg) {\r\n      if (type.isFunction(arg)) return arg.call(this)\r\n      if (type.notStr(arg)) return arg\r\n      if (!arg || arg.charAt(0) !== '_') return arg\r\n      return parse(arg, {\r\n        _route: this.$route.query\r\n      })\r\n    },\r\n    mapDefaultValueToValue () {\r\n      this.dataSource.forEach(props => {\r\n        this.$set(props, '_show', this.isExpand)\r\n        if (props.defaultValue) {\r\n          if (type.isFunction(props.defaultValue)) {\r\n            const ret = props.defaultValue.call(this)\r\n            this.$set(props, '_value', this.buildDefaultValue(ret))\r\n          } else {\r\n            this.$set(props, '_value', this.buildDefaultValue(props.defaultValue))\r\n          }\r\n        }\r\n      })\r\n      return this.dataSource\r\n    },\r\n    handleClickExpandCollapse () {\r\n      this.isExpand = !this.isExpand\r\n    },\r\n    handleClickSearch () {\r\n      const querys = this.extractValues()\r\n      this.$emit('search', querys)\r\n    },\r\n    buildMapto (mapTo = [], dataSource) {\r\n      const [ startField, endField ] = mapTo\r\n      const [ startValue, endValue ] = dataSource || [null, null]\r\n      return {\r\n        [startField]: startValue,\r\n        [endField]: endValue\r\n      }\r\n    },\r\n    extractValues () {\r\n      let ret = {}\r\n      this.innerDataSource.filter(item => item.type !== '_action').forEach(item => {\r\n        switch (item.type) {\r\n          case 'DatePicker':\r\n            ret[item.name] = typeof item._value == 'undefined' ? undefined : moment(item._value).format(item.format)\r\n            break\r\n          case 'ele-date-range':\r\n            if (item.mapTo) {\r\n              Object.assign(ret, this.buildMapto(item.mapTo, item._value))\r\n            } else {\r\n              ret[item.name] = (item._value || []).join(',')\r\n            }\r\n            break\r\n          default:\r\n            ret[item.name] = item._value\r\n            break\r\n        }\r\n      })\r\n      return ret\r\n    },\r\n    cleanValues () {\r\n      this.innerDataSource.filter(item => item.type !== '_action').forEach(item => {\r\n        const { defaultValue } = item\r\n        switch (item.type) {\r\n          case 'Select':\r\n            defaultValue && this.$set(item, '_value', this.buildDefaultValue(defaultValue))\r\n            !defaultValue && this.$set(item, '_value', null)\r\n            break\r\n          case 'DatePicker':\r\n            defaultValue && this.$set(item, '_value', this.buildDefaultValue(defaultValue))\r\n            !defaultValue && this.$set(item, '_value', undefined)\r\n            break\r\n          case 'ele-date-range':\r\n            defaultValue && this.$set(item, '_value', this.buildDefaultValue(defaultValue))\r\n            !defaultValue && this.$set(item, '_value', [])\r\n            break\r\n          default:\r\n            defaultValue && this.$set(item, '_value', this.buildDefaultValue(defaultValue))\r\n            !defaultValue && this.$set(item, '_value', null)\r\n            break\r\n        }\r\n      })\r\n    },\r\n    handleClickReset () {\r\n      this.cleanValues()\r\n      //TODO defaultValue\r\n      const querys = this.extractValues()\r\n      this.$emit('search', querys)\r\n    },\r\n    onChangeSelect (value, props) {\r\n      this.$set(props, '_value', value)\r\n    }\r\n  },\r\n  destroyed () {\r\n    this.cleanValues()\r\n  }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.search-area__wrapper {\r\n  padding-top: 16px;\r\n  padding-left: 16px;\r\n  padding-right: 16px;\r\n  ::v-deep .ant-col {\r\n    &:last-child {\r\n      float: right;\r\n    }\r\n  }\r\n  .search-area__item {\r\n    height: 32px;\r\n    display: flex;\r\n    flex-direction: row;\r\n    align-items: center;\r\n    &.search-area--action {\r\n      justify-content: end;\r\n    }\r\n    .expand-collapse {\r\n      margin-left: 8px;\r\n      height: 32px;\r\n      padding: 4px 16px;\r\n      color: var(--idooel-primary-color);\r\n      display: flex;\r\n      flex-direction: row;\r\n      align-items: center;\r\n      justify-content: center;\r\n      cursor: pointer;\r\n      .expand-collapse__text {\r\n        font-size: 14px;\r\n      }\r\n      .expand-collapse__icon {\r\n        font-size: 16px;\r\n        margin-left: 8px;\r\n      }\r\n    }\r\n  }\r\n}\r\n</style>",".search-area__wrapper {\n  padding-top: 16px;\n  padding-left: 16px;\n  padding-right: 16px;\n}\n.search-area__wrapper ::v-deep .ant-col:last-child {\n  float: right;\n}\n.search-area__wrapper .search-area__item {\n  height: 32px;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n}\n.search-area__wrapper .search-area__item.search-area--action {\n  justify-content: end;\n}\n.search-area__wrapper .search-area__item .expand-collapse {\n  margin-left: 8px;\n  height: 32px;\n  padding: 4px 16px;\n  color: var(--idooel-primary-color);\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n}\n.search-area__wrapper .search-area__item .expand-collapse .expand-collapse__text {\n  font-size: 14px;\n}\n.search-area__wrapper .search-area__item .expand-collapse .expand-collapse__icon {\n  font-size: 16px;\n  margin-left: 8px;\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined });
+      inject("data-v-06dd8a38_0", { source: ".search-area__wrapper[data-v-06dd8a38] {\n  padding-top: 16px;\n  padding-left: 16px;\n  padding-right: 16px;\n}\n.search-area__wrapper[data-v-06dd8a38]  .ant-col:last-child {\n  float: right;\n}\n.search-area__wrapper .search-area__item[data-v-06dd8a38] {\n  height: 32px;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n}\n.search-area__wrapper .search-area__item.search-area--action[data-v-06dd8a38] {\n  justify-content: end;\n}\n.search-area__wrapper .search-area__item .expand-collapse[data-v-06dd8a38] {\n  margin-left: 8px;\n  height: 32px;\n  padding: 4px 16px;\n  color: var(--idooel-primary-color);\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n}\n.search-area__wrapper .search-area__item .expand-collapse .expand-collapse__text[data-v-06dd8a38] {\n  font-size: 14px;\n}\n.search-area__wrapper .search-area__item .expand-collapse .expand-collapse__icon[data-v-06dd8a38] {\n  font-size: 16px;\n  margin-left: 8px;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["C:\\Users\\ZOU\\Code\\OnlineStudy\\base-elearning-frontend-model\\packages\\components\\packages\\composite-components\\search-area\\src\\index.vue","index.vue"],"names":[],"mappings":"AAyMA;EACA,iBAAA;EACA,kBAAA;EACA,mBAAA;ACxMA;AD0MA;EACA,YAAA;ACxMA;AD2MA;EACA,YAAA;EACA,aAAA;EACA,mBAAA;EACA,mBAAA;ACzMA;AD0MA;EACA,oBAAA;ACxMA;AD0MA;EACA,gBAAA;EACA,YAAA;EACA,iBAAA;EACA,kCAAA;EACA,aAAA;EACA,mBAAA;EACA,mBAAA;EACA,uBAAA;EACA,eAAA;ACxMA;ADyMA;EACA,eAAA;ACvMA;ADyMA;EACA,eAAA;EACA,gBAAA;ACvMA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["<template>\r\n  <div class=\"search-area__wrapper\">\r\n    <a-row :gutter=\"gutter\">\r\n      <template v-for=\"(item, idx) in innerDataSource\">\r\n        <a-col v-if=\"item._show\" :span=\"item.span || span\" :key=\"idx\">\r\n          <div v-if=\"item.type == '_action'\" class=\"search-area__item search-area--action\">\r\n            <ele-button icon=\"search\" type=\"primary\" @click=\"handleClickSearch\">查询</ele-button>\r\n            <ele-button style=\"margin-left:8px;\" icon=\"reload\" @click=\"handleClickReset\">重置</ele-button>\r\n            <div v-if=\"innerDataSource.length > cuttingFormula + 1\" class=\"expand-collapse\" @click=\"handleClickExpandCollapse\">\r\n              <span class=\"expand-collapse__text\">{{ isExpand ? '收起' : '展开' }}</span>\r\n              <span class=\"expand-collapse__icon\">\r\n                <a-icon v-if=\"isExpand\" type=\"up\" />\r\n                <a-icon v-else type=\"down\" />\r\n              </span>\r\n            </div>\r\n          </div>\r\n          <div v-else class=\"search-area__item\">\r\n            <template v-if=\"(item.type == 'ele-input') || (item.type == 'Input')\">\r\n              <Label :label=\"item.label\"></Label>\r\n              <ele-input v-model=\"item._value\"></ele-input>\r\n            </template>\r\n            <template v-else-if=\"(item.type == 'ele-select') || (item.type == 'Select')\">\r\n              <Label :label=\"item.label\"></Label>\r\n              <ele-select v-model=\"item._value\" :init=\"item.init\" :mode=\"item.mode\" :code=\"item.code\" :params=\"item.params\" :url=\"item.url\" :multiple=\"item.multiple\" :data-source=\"item.optionList\"></ele-select>\r\n            </template>\r\n            <template v-else-if=\"(item.type == 'ele-date') || (item.type == 'DatePicker')\">\r\n              <Label :label=\"item.label\"></Label>\r\n              <ele-date v-model=\"item._value\" :placeholder=\"item.placeholder\" :format=\"item.format\"></ele-date>\r\n            </template>\r\n            <template v-else-if=\"item.type == 'ele-date-range'\">\r\n              <Label :label=\"item.label\"></Label>\r\n              <ele-date-range v-model=\"item._value\" :format=\"item.format\" :show-time=\"item.showTime\"></ele-date-range>\r\n            </template>\r\n          </div>\r\n        </a-col>\r\n      </template>\r\n    </a-row>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport Label from './label.vue'\r\nimport moment from 'moment'\r\nimport { parse } from '@idooel/expression'\r\nimport { type } from '@idooel/shared'\r\nexport default {\r\n  name: 'ele-search-area',\r\n  components: {\r\n    Label\r\n  },\r\n  props: {\r\n    gutter: {\r\n      type: [Number, Array, Object],\r\n      default: () => ([\r\n        16, 8\r\n      ])\r\n    },\r\n    span: {\r\n      type: Number,\r\n      default: 8\r\n    },\r\n    dataSource: {\r\n      type: Array,\r\n      required: true\r\n    }\r\n  },\r\n  data() {\r\n    return {\r\n      isExpand: false\r\n    }\r\n  },\r\n  computed: {\r\n    cuttingFormula () {\r\n      return (24 / this.span - 1)\r\n    },\r\n    buildDataSource () {\r\n      return this.controlDisplayByFormula(this.mapDefaultValueToValue())\r\n    },\r\n    innerDataSource () {\r\n      return [ ...this.buildDataSource, { type: '_action', _show: true }]\r\n    }\r\n  },\r\n  created() {\r\n    const querys = this.extractValues()\r\n    this.$emit('search', { ...querys, initSearch: true })\r\n  },\r\n  methods: {\r\n    controlDisplayByFormula (dataSource = []) {\r\n      if (this.isExpand) {\r\n        dataSource.forEach(item => {\r\n          this.$set(item, '_show', true)\r\n        })\r\n      } else {\r\n        dataSource.forEach((item, idx) => {\r\n          if (idx < this.cuttingFormula) {\r\n            this.$set(item, '_show', true)\r\n          } else {\r\n            this.$set(item, '_show', false)\r\n          }\r\n        })\r\n      }\r\n      return dataSource\r\n    },\r\n    buildDefaultValue (arg) {\r\n      if (type.isFunction(arg)) return arg.call(this)\r\n      if (type.notStr(arg)) return arg\r\n      if (!arg || arg.charAt(0) !== '_') return arg\r\n      return parse(arg, {\r\n        _route: this.$route.query\r\n      })\r\n    },\r\n    mapDefaultValueToValue () {\r\n      this.dataSource.forEach(props => {\r\n        this.$set(props, '_show', this.isExpand)\r\n        if (props.defaultValue) {\r\n          if (type.isFunction(props.defaultValue)) {\r\n            const ret = props.defaultValue.call(this)\r\n            this.$set(props, '_value', this.buildDefaultValue(ret))\r\n          } else {\r\n            this.$set(props, '_value', this.buildDefaultValue(props.defaultValue))\r\n          }\r\n        }\r\n      })\r\n      return this.dataSource\r\n    },\r\n    handleClickExpandCollapse () {\r\n      this.isExpand = !this.isExpand\r\n    },\r\n    handleClickSearch () {\r\n      const querys = this.extractValues()\r\n      this.$emit('search', querys)\r\n    },\r\n    buildMapto (mapTo = [], dataSource) {\r\n      const [ startField, endField ] = mapTo\r\n      const [ startValue, endValue ] = dataSource || [null, null]\r\n      return {\r\n        [startField]: startValue,\r\n        [endField]: endValue\r\n      }\r\n    },\r\n    extractValues () {\r\n      let ret = {}\r\n      this.innerDataSource.filter(item => item.type !== '_action').forEach(item => {\r\n        switch (item.type) {\r\n          case 'DatePicker':\r\n            ret[item.name] = typeof item._value == 'undefined' ? undefined : moment(item._value).format(item.format)\r\n            break\r\n          case 'ele-date-range':\r\n            if (item.mapTo) {\r\n              Object.assign(ret, this.buildMapto(item.mapTo, item._value))\r\n            } else {\r\n              ret[item.name] = (item._value || []).join(',')\r\n            }\r\n            break\r\n          default:\r\n            ret[item.name] = item._value\r\n            break\r\n        }\r\n      })\r\n      return ret\r\n    },\r\n    cleanValues () {\r\n      this.innerDataSource.filter(item => item.type !== '_action').forEach(item => {\r\n        const { defaultValue } = item\r\n        switch (item.type) {\r\n          case 'Select':\r\n            defaultValue && this.$set(item, '_value', this.buildDefaultValue(defaultValue))\r\n            !defaultValue && this.$set(item, '_value', null)\r\n            break\r\n          case 'DatePicker':\r\n            defaultValue && this.$set(item, '_value', this.buildDefaultValue(defaultValue))\r\n            !defaultValue && this.$set(item, '_value', undefined)\r\n            break\r\n          case 'ele-date-range':\r\n            defaultValue && this.$set(item, '_value', this.buildDefaultValue(defaultValue))\r\n            !defaultValue && this.$set(item, '_value', [])\r\n            break\r\n          default:\r\n            defaultValue && this.$set(item, '_value', this.buildDefaultValue(defaultValue))\r\n            !defaultValue && this.$set(item, '_value', null)\r\n            break\r\n        }\r\n      })\r\n    },\r\n    handleClickReset () {\r\n      this.cleanValues()\r\n      //TODO defaultValue\r\n      const querys = this.extractValues()\r\n      this.$emit('search', querys)\r\n    },\r\n    onChangeSelect (value, props) {\r\n      this.$set(props, '_value', value)\r\n    }\r\n  },\r\n  destroyed () {\r\n    this.cleanValues()\r\n  }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.search-area__wrapper {\r\n  padding-top: 16px;\r\n  padding-left: 16px;\r\n  padding-right: 16px;\r\n  ::v-deep .ant-col {\r\n    &:last-child {\r\n      float: right;\r\n    }\r\n  }\r\n  .search-area__item {\r\n    height: 32px;\r\n    display: flex;\r\n    flex-direction: row;\r\n    align-items: center;\r\n    &.search-area--action {\r\n      justify-content: end;\r\n    }\r\n    .expand-collapse {\r\n      margin-left: 8px;\r\n      height: 32px;\r\n      padding: 4px 16px;\r\n      color: var(--idooel-primary-color);\r\n      display: flex;\r\n      flex-direction: row;\r\n      align-items: center;\r\n      justify-content: center;\r\n      cursor: pointer;\r\n      .expand-collapse__text {\r\n        font-size: 14px;\r\n      }\r\n      .expand-collapse__icon {\r\n        font-size: 16px;\r\n        margin-left: 8px;\r\n      }\r\n    }\r\n  }\r\n}\r\n</style>",".search-area__wrapper {\n  padding-top: 16px;\n  padding-left: 16px;\n  padding-right: 16px;\n}\n.search-area__wrapper ::v-deep .ant-col:last-child {\n  float: right;\n}\n.search-area__wrapper .search-area__item {\n  height: 32px;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n}\n.search-area__wrapper .search-area__item.search-area--action {\n  justify-content: end;\n}\n.search-area__wrapper .search-area__item .expand-collapse {\n  margin-left: 8px;\n  height: 32px;\n  padding: 4px 16px;\n  color: var(--idooel-primary-color);\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n}\n.search-area__wrapper .search-area__item .expand-collapse .expand-collapse__text {\n  font-size: 14px;\n}\n.search-area__wrapper .search-area__item .expand-collapse .expand-collapse__icon {\n  font-size: 16px;\n  margin-left: 8px;\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined });
 
     };
     /* scoped */
-    const __vue_scope_id__$b = "data-v-77b7e5ba";
+    const __vue_scope_id__$b = "data-v-06dd8a38";
     /* module identifier */
     const __vue_module_identifier__$b = undefined;
     /* functional template */
@@ -14800,8 +14806,8 @@
         const currentTableSelectionRet = shared.type.isArray(currentTableSelection) ? currentTableSelection : [currentTableSelection];
         this.entityValue = currentTableSelectionRet.map(item => {
           return {
-            label: item[this.replaceFields.label],
-            value: item[this.replaceFields.value]
+            label: item[this.returnValues[this.replaceFields.label]],
+            value: item[this.returnValues[this.replaceFields.value]]
           };
         });
         this.emitEntityValue(currentTableSelection);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@idooel/components",
-  "version": "0.0.2-beta.20",
+  "version": "0.0.2-beta.22",
   "description": "",
   "private": false,
   "main": "dist/@idooel/components.umd.js",

package/packages/composite-components/search-area/src/index.vue

@@ -82,7 +82,7 @@ export default {
   },
   created() {
     const querys = this.extractValues()
-    this.$emit('search', querys)
+    this.$emit('search', { ...querys, initSearch: true })
   },
   methods: {
     controlDisplayByFormula (dataSource = []) {

package/packages/composite-components/select-entity-modal-table/src/index.vue

@@ -154,8 +154,8 @@ export default {
       const currentTableSelectionRet = type.isArray(currentTableSelection) ? currentTableSelection : [currentTableSelection]
       this.entityValue = currentTableSelectionRet.map(item => {
         return {
-          label: item[this.replaceFields.label],
-          value: item[this.replaceFields.value]
+          label: item[this.returnValues[this.replaceFields.label]],
+          value: item[this.returnValues[this.replaceFields.value]]
         }
       })
       this.emitEntityValue(currentTableSelection)

package/packages/models/tree-table-model/src/index.vue

@@ -641,7 +641,8 @@ export default {
       if (overrideInit) {
         this.$emit(RESERVE_EVENT_NAMES.TREE_CHANGE, { ...this.exposed })
       } else {
-        if (this.showTree) return
+        const { initSearch = false } = props
+        if (this.showTree && initSearch) return
         this.tableData = await this.requestTableData()
       }
     },