@touchvue/ui 0.0.1-alpha.2

package/lib/components/table/index.js

@@ -0,0 +1,898 @@
+'use strict';
+
+var vue = require('vue');
+
+const _hoisted_1$3 = { class: "to-table-table" };
+const _hoisted_2$2 = { class: "to-table-head" };
+const _hoisted_3$1 = { class: "to-table-head-row" };
+const _hoisted_4$1 = { class: "to-table-body" };
+const _hoisted_5$1 = ["onClick"];
+var _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
+  ...{
+    name: "ToTable"
+  },
+  __name: "table",
+  props: {
+    columns: { type: Array, required: false, default: () => [] },
+    data: { type: Array, required: false, default: () => [] },
+    height: { type: [Number, String], required: false, default: "" }
+  },
+  setup(__props) {
+    const props = __props;
+    const flatData = vue.computed(() => flattenTree(props.data));
+    const expandedSet = vue.ref(/* @__PURE__ */ new Set());
+    let uid = 0;
+    function flattenTree(data, level = 0, parentId) {
+      const result = [];
+      for (const item of data) {
+        const id = uid++;
+        const { children, ...rest } = item;
+        result.push({ ...rest, id, parentId, level });
+        if (children && Array.isArray(children)) {
+          result.push(...flattenTree(children, level + 1, id));
+        }
+      }
+      return result;
+    }
+    function isVisible(item, all) {
+      let parentId = item.parentId;
+      while (parentId !== void 0) {
+        if (!expandedSet.value.has(parentId))
+          return false;
+        const parent = all.find((n) => n.id === parentId);
+        parentId = parent == null ? void 0 : parent.parentId;
+      }
+      return true;
+    }
+    const visibleRows = vue.computed(
+      () => flatData.value.filter((item) => item.level === 0 || isVisible(item, flatData.value))
+    );
+    function toggleExpand(row) {
+      if (expandedSet.value.has(row.id)) {
+        expandedSet.value.delete(row.id);
+      } else {
+        expandedSet.value.add(row.id);
+      }
+    }
+    function hasChildren(row) {
+      return flatData.value.some((item) => item.parentId === row.id);
+    }
+    const setClass = vue.computed(() => {
+      const classes = [];
+      if (props.height === "full")
+        classes.push("height-full");
+      return classes;
+    });
+    const setTdClass = (column) => {
+      return vue.computed(() => {
+        const classes = [];
+        if (column.type === "action")
+          classes.push("is-action");
+        return classes;
+      });
+    };
+    const setStyle = vue.computed(() => {
+      const obj = {};
+      if (props.height && props.height !== "full") {
+        obj.height = isNaN(Number(props.height)) ? String(props.height) : `${props.height}em`;
+      }
+      return obj;
+    });
+    return (_ctx, _cache) => {
+      const _component_ToCheckbox = vue.resolveComponent("ToCheckbox");
+      return vue.openBlock(), vue.createElementBlock(
+        "div",
+        {
+          class: vue.normalizeClass(["to-table", setClass.value]),
+          style: vue.normalizeStyle(setStyle.value)
+        },
+        [
+          vue.createElementVNode("table", _hoisted_1$3, [
+            vue.createElementVNode("thead", _hoisted_2$2, [
+              vue.createElementVNode("tr", _hoisted_3$1, [
+                (vue.openBlock(true), vue.createElementBlock(
+                  vue.Fragment,
+                  null,
+                  vue.renderList(_ctx.columns, (column) => {
+                    return vue.openBlock(), vue.createElementBlock(
+                      vue.Fragment,
+                      null,
+                      [
+                        column.type === "check" ? (vue.openBlock(), vue.createElementBlock("th", {
+                          key: column.prop + "check",
+                          class: "to-table-th is-check"
+                        }, [
+                          vue.createVNode(_component_ToCheckbox)
+                        ])) : (vue.openBlock(), vue.createElementBlock(
+                          "th",
+                          {
+                            class: "to-table-th",
+                            key: column.prop
+                          },
+                          vue.toDisplayString(column.label),
+                          1
+                          /* TEXT */
+                        ))
+                      ],
+                      64
+                      /* STABLE_FRAGMENT */
+                    );
+                  }),
+                  256
+                  /* UNKEYED_FRAGMENT */
+                ))
+              ])
+            ]),
+            vue.createElementVNode("tbody", _hoisted_4$1, [
+              (vue.openBlock(true), vue.createElementBlock(
+                vue.Fragment,
+                null,
+                vue.renderList(visibleRows.value, (row, rowIndex) => {
+                  return vue.openBlock(), vue.createElementBlock("tr", {
+                    class: "to-table-body-row",
+                    key: rowIndex
+                  }, [
+                    (vue.openBlock(true), vue.createElementBlock(
+                      vue.Fragment,
+                      null,
+                      vue.renderList(_ctx.columns, (column) => {
+                        return vue.openBlock(), vue.createElementBlock(
+                          vue.Fragment,
+                          null,
+                          [
+                            column.type === "check" ? (vue.openBlock(), vue.createElementBlock("td", {
+                              key: column.prop + "check",
+                              class: "to-table-td is-check"
+                            }, [
+                              vue.createVNode(_component_ToCheckbox)
+                            ])) : (vue.openBlock(), vue.createElementBlock(
+                              "td",
+                              {
+                                class: vue.normalizeClass(["to-table-td", setTdClass(column).value]),
+                                key: column.prop,
+                                style: vue.normalizeStyle({ paddingLeft: column.toggler && row.level ? `${row.level + 2}em` : "" })
+                              },
+                              [
+                                hasChildren(row) && column.toggler ? (vue.openBlock(), vue.createElementBlock("span", {
+                                  key: 0,
+                                  onClick: ($event) => toggleExpand(row),
+                                  class: vue.normalizeClass(["to-table-toggle", {
+                                    "is-expand": expandedSet.value.has(row.id)
+                                  }])
+                                }, null, 10, _hoisted_5$1)) : vue.createCommentVNode("v-if", true),
+                                vue.renderSlot(_ctx.$slots, column.prop, {
+                                  row,
+                                  index: rowIndex
+                                }, () => [
+                                  column.prop ? (vue.openBlock(), vue.createElementBlock(
+                                    vue.Fragment,
+                                    { key: 0 },
+                                    [
+                                      vue.createTextVNode(
+                                        vue.toDisplayString(row[column.prop]),
+                                        1
+                                        /* TEXT */
+                                      )
+                                    ],
+                                    64
+                                    /* STABLE_FRAGMENT */
+                                  )) : vue.createCommentVNode("v-if", true)
+                                ])
+                              ],
+                              6
+                              /* CLASS, STYLE */
+                            ))
+                          ],
+                          64
+                          /* STABLE_FRAGMENT */
+                        );
+                      }),
+                      256
+                      /* UNKEYED_FRAGMENT */
+                    ))
+                  ]);
+                }),
+                128
+                /* KEYED_FRAGMENT */
+              ))
+            ])
+          ])
+        ],
+        6
+        /* CLASS, STYLE */
+      );
+    };
+  }
+});
+
+var _export_sfc = (sfc, props) => {
+  const target = sfc.__vccOpts || sfc;
+  for (const [key, val] of props) {
+    target[key] = val;
+  }
+  return target;
+};
+
+var Table = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__file", "/Users/wangding/WorkSpace/AsiaInfo/projects/\u524D\u7AEF\u6846\u67B6/touch-vue3-ui/packages/components/table/src/table.vue"]]);
+
+const _hoisted_1$2 = { class: "config" };
+var _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
+  ...{
+    name: "ToTableConfig"
+  },
+  __name: "table-config",
+  props: {
+    data: { type: Array, default: () => [] }
+  },
+  emits: ["change"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const checked = vue.ref([]);
+    const configData = vue.ref([]);
+    const configIconRef = vue.ref();
+    const floatRef = vue.ref();
+    function setConfigData() {
+      const data = JSON.parse(JSON.stringify(props.data));
+      function setData(data2, path) {
+        data2.forEach((dataItem, dataIndex) => {
+          if (dataItem.type === "selection" || dataItem.type === "radio") {
+            dataItem.label = "\u9009\u62E9\u5668";
+          }
+          if (dataItem.type === "action") {
+            data2.splice(dataIndex, 1);
+          }
+          dataItem.path = path ? path.concat(dataItem.label) : [dataItem.label];
+          if (dataItem.children) {
+            setData(dataItem.children, dataItem.path);
+          }
+        });
+      }
+      setData(data);
+      configData.value = data;
+    }
+    function setChecked() {
+      const arr = [];
+      function setData(data) {
+        data.forEach((dataItem) => {
+          if (dataItem.show !== false) {
+            if (dataItem.type === "selection") {
+              arr.push("\u9009\u62E9\u5668");
+            } else {
+              arr.push(dataItem.label);
+            }
+          }
+          if (dataItem.children) {
+            setData(dataItem.children);
+          }
+        });
+      }
+      setData(props.data);
+      checked.value = arr;
+    }
+    function flex() {
+      var _a, _b;
+      (_b = floatRef.value) == null ? void 0 : _b.set((_a = configIconRef.value) == null ? void 0 : _a.$el);
+    }
+    function check(checkedKeys, checkedNodes, node, checkedFlag) {
+      const data = JSON.parse(JSON.stringify(props.data));
+      function checkData(data2) {
+        data2.forEach((dataItem) => {
+          if (dataItem.type === "selection") {
+            dataItem.show = checkedKeys.includes("\u9009\u62E9\u5668");
+          } else {
+            dataItem.show = checkedKeys.includes(dataItem.label) || dataItem.type === "action";
+          }
+          if (dataItem.children) {
+            checkData(dataItem.children);
+          }
+        });
+      }
+      function setChildrenHide(data2, setHide) {
+        data2.forEach((dataItem) => {
+          if (setHide) {
+            dataItem.show = false;
+            checked.value = checked.value.filter((item) => item !== dataItem.label);
+          }
+          if (dataItem.children) {
+            setChildrenHide(dataItem.children, dataItem.label === node.label || setHide);
+          }
+        });
+      }
+      function setChildrenAndParentShow(data2, setShow) {
+        data2.forEach((dataItem) => {
+          if (setShow || node.path.includes(dataItem.label)) {
+            dataItem.show = true;
+            if (!checked.value.includes(dataItem.label)) {
+              checked.value.push(dataItem.label);
+            }
+          }
+          if (dataItem.children) {
+            setChildrenAndParentShow(dataItem.children, dataItem.label === node.label || setShow);
+          }
+        });
+      }
+      checkData(data);
+      if (!checkedFlag) {
+        setChildrenHide(data, false);
+        checked.value = checked.value.filter((item) => item !== node.label);
+      } else {
+        setChildrenAndParentShow(data, false);
+        checked.value.push(node.label);
+      }
+      emit("change", data);
+    }
+    vue.onMounted(() => {
+      setConfigData();
+      setChecked();
+    });
+    vue.watch(() => props.data, () => {
+      setConfigData();
+      setChecked();
+    });
+    return (_ctx, _cache) => {
+      const _component_to_icon = vue.resolveComponent("to-icon");
+      const _component_to_tree = vue.resolveComponent("to-tree");
+      const _component_to_scroll = vue.resolveComponent("to-scroll");
+      const _component_to_float = vue.resolveComponent("to-float");
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$2, [
+        vue.createVNode(
+          _component_to_icon,
+          {
+            ref: "configIcon",
+            value: "config",
+            color: "info",
+            mode: "none",
+            link: "",
+            fillet: "round",
+            onClick: _cache[0] || (_cache[0] = () => {
+              var _a;
+              return (_a = floatRef.value.value) == null ? void 0 : _a.toggle(configIconRef.value.value);
+            })
+          },
+          null,
+          512
+          /* NEED_PATCH */
+        ),
+        vue.createVNode(
+          _component_to_float,
+          {
+            ref_key: "floatRef",
+            ref: floatRef,
+            width: "18",
+            lazy: false
+          },
+          {
+            default: vue.withCtx(() => [
+              vue.createVNode(_component_to_scroll, { padding: "0.5" }, {
+                default: vue.withCtx(() => [
+                  vue.createVNode(_component_to_tree, {
+                    "show-checkbox": "",
+                    "check-strictly": "",
+                    expand: "",
+                    "check-on-click-node": "",
+                    data: configData.value,
+                    "value-text": "label",
+                    "checked-keys": checked.value,
+                    onCheckChange: check,
+                    onNodeExpand: flex,
+                    onNodeCollapse: flex
+                  }, null, 8, ["data", "checked-keys"])
+                ]),
+                _: 1
+                /* STABLE */
+              })
+            ]),
+            _: 1
+            /* STABLE */
+          },
+          512
+          /* NEED_PATCH */
+        )
+      ]);
+    };
+  }
+});
+
+var TableConfig = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__file", "/Users/wangding/WorkSpace/AsiaInfo/projects/\u524D\u7AEF\u6846\u67B6/touch-vue3-ui/packages/components/table/src/table-config.vue"]]);
+
+const _hoisted_1$1 = { ref: "row" };
+const _hoisted_2$1 = ["rowspan", "colspan"];
+const _hoisted_3 = ["rowspan", "colspan"];
+const _hoisted_4 = ["rowspan", "colspan", "onClick"];
+const _hoisted_5 = ["rowspan", "colspan"];
+const _hoisted_6 = ["rowspan", "colspan", "onClick"];
+var _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
+  ...{
+    name: "ToTableHead"
+  },
+  __name: "table-head",
+  props: {
+    name: { type: String, default: "" },
+    start: { type: Number, default: null },
+    end: { type: Number, default: null },
+    data: { type: Array, default: () => [] },
+    configurable: Boolean
+  },
+  emits: ["select-all", "column-change"],
+  setup(__props, { emit: __emit }) {
+    const t = (str) => str;
+    const props = __props;
+    const emit = __emit;
+    const ToTable = vue.inject("ToTable");
+    const showColumn = (column, columnIndex) => {
+      console.log(columnIndex);
+      if (column.show === false)
+        return false;
+      if (["selection", "radio", "action"].includes(column.type))
+        return true;
+      if (ToTable.showColumns || ToTable.showColumns === 0) {
+        if (!isNaN(ToTable.showColumns)) {
+          const index = ToTable.normalColumn.findIndex((item) => column.prop === item.prop);
+          return index !== -1 && index < Number(ToTable.showColumns);
+        } else {
+          return ToTable.showColumns.split(",").includes(column.prop);
+        }
+      }
+      return true;
+    };
+    function countLeafNodes(tree) {
+      if (!tree || tree.length === 0)
+        return 0;
+      let leafCount = 0;
+      for (let i = 0; i < tree.length; i++) {
+        if (tree[i].show !== false) {
+          if (!tree[i].children || tree[i].children.length === 0 || tree[i].children.every((child) => child.show === false)) {
+            leafCount += 1;
+          } else {
+            leafCount += countLeafNodes(tree[i].children);
+          }
+        }
+      }
+      return leafCount;
+    }
+    const tableData = vue.computed(() => {
+      const result = [];
+      let maxDepth = 0;
+      function calculateMaxDepth(heads, depth = 1) {
+        heads.forEach((head) => {
+          if (head.children) {
+            calculateMaxDepth(head.children, depth + 1);
+          }
+        });
+        maxDepth = Math.max(maxDepth, depth);
+      }
+      calculateMaxDepth(props.data);
+      function generateTableData(heads, depth = 0, rowIndex = 0) {
+        if (!result[rowIndex])
+          result[rowIndex] = [];
+        heads.forEach((head) => {
+          const cell = Object.assign({}, head, { rowspan: 1, colspan: 1 });
+          if (head.children && !head.children.every((child) => child.show === false)) {
+            cell.colspan = countLeafNodes(head.children);
+            result[rowIndex].push(cell);
+            generateTableData(head.children, depth + 1, rowIndex + 1);
+          } else {
+            cell.rowspan = maxDepth - depth;
+            result[rowIndex].push(cell);
+          }
+        });
+      }
+      generateTableData(JSON.parse(JSON.stringify(props.data)));
+      return result;
+    });
+    function checkAllChange(checked) {
+      emit("select-all", checked);
+    }
+    function configChange(data) {
+      emit("column-change", data);
+    }
+    return (_ctx, _cache) => {
+      const _component_to_checkbox = vue.resolveComponent("to-checkbox");
+      const _component_to_icon = vue.resolveComponent("to-icon");
+      return vue.openBlock(), vue.createElementBlock(
+        "thead",
+        _hoisted_1$1,
+        [
+          (vue.openBlock(true), vue.createElementBlock(
+            vue.Fragment,
+            null,
+            vue.renderList(tableData.value, (titem, tindex) => {
+              return vue.openBlock(), vue.createElementBlock("tr", { key: tindex }, [
+                (vue.openBlock(true), vue.createElementBlock(
+                  vue.Fragment,
+                  null,
+                  vue.renderList(titem, (item, index) => {
+                    return vue.openBlock(), vue.createElementBlock(
+                      vue.Fragment,
+                      null,
+                      [
+                        showColumn(item, index) ? (vue.openBlock(), vue.createElementBlock(
+                          vue.Fragment,
+                          { key: 0 },
+                          [
+                            vue.unref(ToTable).isNeedSelectAll && item.type === "selection" ? (vue.openBlock(), vue.createElementBlock("th", {
+                              key: index + "_selection",
+                              class: vue.normalizeClass(["selection", [item.sortable === true ? "sort" : "", "checkbox"]]),
+                              rowspan: item.rowspan || 1,
+                              colspan: item.colspan || 1
+                            }, [
+                              vue.createVNode(_component_to_checkbox, {
+                                value: vue.unref(ToTable).isSelectAll && vue.unref(ToTable).iData.length > 0,
+                                onChange: checkAllChange
+                              }, null, 8, ["value"])
+                            ], 10, _hoisted_2$1)) : item.type === "radio" ? (vue.openBlock(), vue.createElementBlock("th", {
+                              key: index + "_radio",
+                              class: vue.normalizeClass(["radio", [item.sortable === true ? "sort" : "", "index"]]),
+                              rowspan: item.rowspan || 1,
+                              colspan: item.colspan || 1
+                            }, vue.toDisplayString(t("to.common.select")), 11, _hoisted_3)) : item.type === "index" ? (vue.openBlock(), vue.createElementBlock("th", {
+                              key: index + "_index",
+                              rowspan: item.rowspan || 1,
+                              colspan: item.colspan || 1,
+                              class: vue.normalizeClass([item.sortable === true ? "sort" : "", "index"]),
+                              onClick: ($event) => vue.unref(ToTable).handleTableHeadCellClick(item, index, $event)
+                            }, [
+                              item.sortable === true ? (vue.openBlock(), vue.createElementBlock(
+                                vue.Fragment,
+                                { key: 0 },
+                                [
+                                  item.orderType == "asc" ? (vue.openBlock(), vue.createBlock(_component_to_icon, {
+                                    key: 0,
+                                    value: "fold"
+                                  })) : vue.createCommentVNode("v-if", true),
+                                  item.orderType == "desc" ? (vue.openBlock(), vue.createBlock(_component_to_icon, {
+                                    key: 1,
+                                    value: "unfold"
+                                  })) : vue.createCommentVNode("v-if", true)
+                                ],
+                                64
+                                /* STABLE_FRAGMENT */
+                              )) : vue.createCommentVNode("v-if", true),
+                              vue.createElementVNode(
+                                "span",
+                                null,
+                                vue.toDisplayString(vue.unref(ToTable).indexColumnName || item.label),
+                                1
+                                /* TEXT */
+                              )
+                            ], 10, _hoisted_4)) : item.type === "action" && __props.configurable && vue.unref(ToTable).hasAction ? (vue.openBlock(), vue.createElementBlock("th", {
+                              key: index + "_action",
+                              rowspan: item.rowspan || 1,
+                              colspan: item.colspan || 1,
+                              class: "configTh action"
+                            }, [
+                              vue.createVNode(TableConfig, {
+                                data: vue.unref(ToTable).columns,
+                                onChange: configChange
+                              }, null, 8, ["data"])
+                            ], 8, _hoisted_5)) : !(item.type === "action" && vue.unref(ToTable).contextAction) ? (vue.openBlock(), vue.createElementBlock("th", {
+                              key: index + "_other",
+                              rowspan: item.rowspan || 1,
+                              colspan: item.colspan || 1,
+                              class: vue.normalizeClass([item.sortable === true ? "sort" : "", item.type === "action" ? "action" : ""]),
+                              onClick: ($event) => vue.unref(ToTable).handleTableHeadCellClick(item, index, $event)
+                            }, [
+                              item.sortable === true ? (vue.openBlock(), vue.createElementBlock(
+                                "span",
+                                {
+                                  key: 0,
+                                  class: vue.normalizeClass(["to-table-sorticon", `type-${item.orderType}`])
+                                },
+                                [
+                                  vue.createVNode(_component_to_icon, {
+                                    value: "fold",
+                                    type: "fill"
+                                  }),
+                                  vue.createVNode(_component_to_icon, {
+                                    value: "unfold",
+                                    type: "fill"
+                                  })
+                                ],
+                                2
+                                /* CLASS */
+                              )) : vue.createCommentVNode("v-if", true),
+                              vue.renderSlot(_ctx.$slots, item.prop + "_th", {
+                                column: item,
+                                index
+                              }, () => [
+                                vue.createElementVNode(
+                                  "span",
+                                  null,
+                                  vue.toDisplayString(item.label),
+                                  1
+                                  /* TEXT */
+                                )
+                              ])
+                            ], 10, _hoisted_6)) : vue.createCommentVNode("v-if", true)
+                          ],
+                          64
+                          /* STABLE_FRAGMENT */
+                        )) : vue.createCommentVNode("v-if", true)
+                      ],
+                      64
+                      /* STABLE_FRAGMENT */
+                    );
+                  }),
+                  256
+                  /* UNKEYED_FRAGMENT */
+                ))
+              ]);
+            }),
+            128
+            /* KEYED_FRAGMENT */
+          ))
+        ],
+        512
+        /* NEED_PATCH */
+      );
+    };
+  }
+});
+
+var TableHead = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__file", "/Users/wangding/WorkSpace/AsiaInfo/projects/\u524D\u7AEF\u6846\u67B6/touch-vue3-ui/packages/components/table/src/table-head.vue"]]);
+
+const _hoisted_1 = ["data-index", "onContextmenu"];
+const _hoisted_2 = { key: 0 };
+var _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...{
+    name: "ToTableBody"
+  },
+  __name: "table-body",
+  props: {
+    columnData: { type: Array, default: () => [] },
+    data: { type: Array, default: () => [] }
+  },
+  setup(__props) {
+    const props = __props;
+    const ToTable = vue.inject("ToTable");
+    const isClick = vue.ref(false);
+    const isDblClick = vue.ref(false);
+    const clickTimer = vue.ref(null);
+    const showColumn = (column, columnIndex) => {
+      console.log(columnIndex);
+      if (column.show === false)
+        return false;
+      if (ToTable.type === "v") {
+        if (["key", "desc", "icon", "state", "selection", "radio", "action"].includes(column.type))
+          return false;
+      } else {
+        if (["selection", "radio", "action"].includes(column.type))
+          return true;
+      }
+      if (ToTable.showColumns) {
+        if (!isNaN(ToTable.showColumns)) {
+          const index = ToTable.normalColumn.findIndex((item) => column.prop === item.prop);
+          return index !== -1 && index < Number(ToTable.showColumns);
+        } else {
+          return ToTable.showColumns.split(",").includes(column.prop);
+        }
+      }
+      return true;
+    };
+    const setClass = (column) => {
+      const arr = [];
+      if (column.type === "key")
+        arr.push("key");
+      if (column.type === "action")
+        arr.push("action");
+      if (column.type === "edit")
+        arr.push("edit");
+      if (column.type === "desc")
+        arr.push("desc");
+      if (column.wrap)
+        arr.push("wrap");
+      if (column.className)
+        arr.push(...column.className.split(","));
+      return arr;
+    };
+    console.log(setClass);
+    const setTrClass = (dataItem) => {
+      const arr = [];
+      if (dataItem._on)
+        arr.push("on");
+      if (dataItem._hover)
+        arr.push("hover");
+      if (dataItem._active)
+        arr.push("active");
+      if (dataItem._className)
+        arr.push(...dataItem._className.split(","));
+      return arr;
+    };
+    const setTrStyle = vue.computed(() => {
+      const obj = {};
+      if (ToTable.space)
+        obj.marginTop = `${ToTable.space}em`;
+      return obj;
+    });
+    const tableData = vue.computed(() => {
+      const result = [];
+      function traverse(headers) {
+        headers.forEach((header) => {
+          if (header.children && !header.children.every((child) => child.show === false)) {
+            traverse(header.children);
+          } else {
+            result.push(header);
+          }
+        });
+      }
+      traverse(props.columnData);
+      return result;
+    });
+    function toggleFold(item, index) {
+      if (!item._showChild) {
+        item._showChild = true;
+      } else {
+        item._showChild = false;
+      }
+      for (let i = index + 1; i < props.data.length; i++) {
+        const el = props.data[i];
+        if (item._showChild) {
+          if (el._level === item._level + 1) {
+            el._show = true;
+          } else if (el._level <= item._level) {
+            break;
+          }
+        } else {
+          if (el._level === item._level + 1) {
+            hide(el, i);
+          } else if (el._level <= item._level) {
+            break;
+          }
+        }
+      }
+      function hide(tr, index2) {
+        tr._show = false;
+        tr._showChild = false;
+        if (tr._hasChild) {
+          for (let i = index2 + 1; i < props.data.length; i++) {
+            const el = props.data[i];
+            if (el._level === tr._level + 1) {
+              hide(el, i);
+            } else {
+              break;
+            }
+          }
+        }
+      }
+      ToTable.adjust();
+    }
+    console.log(toggleFold);
+    function clickHandle(event) {
+      const path = event.composedPath ? event.composedPath() : event.path;
+      if (ToTable.$listeners && (ToTable.$listeners["row-dblclick"] || ToTable.$listeners["cell-dblclick"])) {
+        clickTimer.value = window.setTimeout(() => {
+          if (!isDblClick.value) {
+            isClick.value = true;
+            ToTable.handleTableClick(event, path);
+            const timer = window.setTimeout(() => {
+              isClick.value = false;
+              clearTimeout(timer);
+            }, 300);
+          } else {
+            isDblClick.value = false;
+          }
+          if (clickTimer.value)
+            clearTimeout(clickTimer.value);
+        }, 300);
+      } else {
+        ToTable.handleTableClick(event);
+      }
+    }
+    function dbclickHandle(event) {
+      if (!isClick.value) {
+        isDblClick.value = true;
+        ToTable.handleTableDblClick(event);
+      } else {
+        isClick.value = false;
+      }
+    }
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock(
+        "tbody",
+        {
+          ref: "tbody",
+          onClick: clickHandle,
+          onMouseover: _cache[0] || (_cache[0] = //@ts-ignore
+          (...args) => vue.unref(ToTable).handleTableMouseover && vue.unref(ToTable).handleTableMouseover(...args)),
+          onMouseout: _cache[1] || (_cache[1] = //@ts-ignore
+          (...args) => vue.unref(ToTable).handleTableMouseout && vue.unref(ToTable).handleTableMouseout(...args)),
+          onMousedown: _cache[2] || (_cache[2] = //@ts-ignore
+          (...args) => vue.unref(ToTable).handleTableMousedown && vue.unref(ToTable).handleTableMousedown(...args)),
+          onTouchstart: _cache[3] || (_cache[3] = //@ts-ignore
+          (...args) => vue.unref(ToTable).handleTableMousedown && vue.unref(ToTable).handleTableMousedown(...args)),
+          onTouchmove: _cache[4] || (_cache[4] = //@ts-ignore
+          (...args) => vue.unref(ToTable).handleTableMousemove && vue.unref(ToTable).handleTableMousemove(...args)),
+          onMouseup: _cache[5] || (_cache[5] = //@ts-ignore
+          (...args) => vue.unref(ToTable).handleTableMouseup && vue.unref(ToTable).handleTableMouseup(...args)),
+          onTouchend: _cache[6] || (_cache[6] = //@ts-ignore
+          (...args) => vue.unref(ToTable).handleTableMouseup && vue.unref(ToTable).handleTableMouseup(...args)),
+          onDblclick: dbclickHandle
+        },
+        [
+          (vue.openBlock(true), vue.createElementBlock(
+            vue.Fragment,
+            null,
+            vue.renderList(__props.data, (dataItem, dataIndex) => {
+              return vue.withDirectives((vue.openBlock(), vue.createElementBlock("tr", {
+                key: dataIndex,
+                class: vue.normalizeClass(setTrClass(dataItem)),
+                style: vue.normalizeStyle(setTrStyle.value),
+                "data-index": dataIndex,
+                onContextmenu: vue.withModifiers(($event) => vue.unref(ToTable).handleTableRowRightClick(dataItem, dataIndex, $event), ["prevent"])
+              }, [
+                vue.unref(ToTable).type === "v" ? (vue.openBlock(), vue.createElementBlock("td", _hoisted_2, [
+                  vue.renderSlot(_ctx.$slots, "v", {
+                    row: dataItem,
+                    index: dataIndex
+                  }, () => [
+                    vue.createCommentVNode(" ... \u4FDD\u6301\u539F\u6709\u7ED3\u6784 ... ")
+                  ])
+                ])) : (vue.openBlock(true), vue.createElementBlock(
+                  vue.Fragment,
+                  { key: 1 },
+                  vue.renderList(tableData.value, (column, columnIndex) => {
+                    return vue.openBlock(), vue.createElementBlock(
+                      vue.Fragment,
+                      null,
+                      [
+                        showColumn(column, columnIndex) ? (vue.openBlock(), vue.createElementBlock(
+                          vue.Fragment,
+                          { key: 0 },
+                          [
+                            vue.createCommentVNode(" ... \u4FDD\u6301\u539F\u6709\u7ED3\u6784 ... ")
+                          ],
+                          64
+                          /* STABLE_FRAGMENT */
+                        )) : vue.createCommentVNode("v-if", true)
+                      ],
+                      64
+                      /* STABLE_FRAGMENT */
+                    );
+                  }),
+                  256
+                  /* UNKEYED_FRAGMENT */
+                ))
+              ], 46, _hoisted_1)), [
+                [vue.vShow, dataItem._show]
+              ]);
+            }),
+            128
+            /* KEYED_FRAGMENT */
+          ))
+        ],
+        544
+        /* NEED_HYDRATION, NEED_PATCH */
+      );
+    };
+  }
+});
+
+var TableBody = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "/Users/wangding/WorkSpace/AsiaInfo/projects/\u524D\u7AEF\u6846\u67B6/touch-vue3-ui/packages/components/table/src/table-body.vue"]]);
+
+const withInstall = (main, extra) => {
+  main.install = (app) => {
+    for (const comp of [main, ...Object.values(extra != null ? extra : {})]) {
+      app.component(comp.name, comp);
+    }
+  };
+  if (extra) {
+    for (const [key, comp] of Object.entries(extra)) {
+      main[key] = comp;
+    }
+  }
+  return main;
+};
+
+navigator.userAgent.toLowerCase();
+
+const ToTable = withInstall(Table);
+const ToTableHead = withInstall(TableHead);
+const ToTableBody = withInstall(TableBody);
+const ToTableConfig = withInstall(TableConfig);
+
+exports.ToTable = ToTable;
+exports.ToTableBody = ToTableBody;
+exports.ToTableConfig = ToTableConfig;
+exports.ToTableHead = ToTableHead;
+//# sourceMappingURL=index.js.map