ivue-material-plus/dist/unplugin-vue-components/es/components/ivue-table/table.mjs.map

A high quality UI components Library with Vue.js

{"version":3,"file":"table.mjs","sources":["../../../../../src/components/ivue-table/table.vue"],"sourcesContent":["<template>\r\n  <div\r\n    :class=\"wrapperClass\"\r\n    @mouseleave=\"handleMouseLeave()\"\r\n    ref=\"tableWrapper\"\r\n  >\r\n    <!-- 外层 -->\r\n    <div :class=\"`${prefixCls}-content`\" :style=\"contentStyles\">\r\n      <!-- hidden -->\r\n      <div ref=\"hiddenColumns\" :class=\"`${prefixCls}-hidden`\">\r\n        <slot />\r\n      </div>\r\n\r\n      <!-- 头部 -->\r\n      <div\r\n        :class=\"`${prefixCls}-header--wrapper`\"\r\n        v-mousewheel=\"handleMousewheel\"\r\n        ref=\"header\"\r\n        v-if=\"showHeader && tableLayout === 'fixed'\"\r\n      >\r\n        <table\r\n          :class=\"`${prefixCls}-header`\"\r\n          :style=\"tableStyles\"\r\n          border=\"0\"\r\n          cellpadding=\"0\"\r\n          cellspacing=\"0\"\r\n          ref=\"tableHeader\"\r\n        >\r\n          <!-- colgroup -->\r\n          <ivue-colgroup\r\n            :columns=\"store.states.columns.value\"\r\n            :tableLayout=\"tableLayout\"\r\n          ></ivue-colgroup>\r\n          <!-- header -->\r\n          <table-header\r\n            :border=\"border\"\r\n            :defaultSort=\"defaultSort\"\r\n            :store=\"store\"\r\n            :tooltipStop=\"tooltipStop\"\r\n            @on-drag-visible=\"handleDragVisible\"\r\n            ref=\"tableHeaderContent\"\r\n          ></table-header>\r\n        </table>\r\n      </div>\r\n      <!-- 内容 -->\r\n      <div :class=\"`${prefixCls}-body-wrapper`\" ref=\"bodyWrapper\">\r\n        <ivue-scrollbar\r\n          :wrapperStyle=\"scrollbarWrapperStyle\"\r\n          :contentStyle=\"scrollbarContentStyle\"\r\n          :always=\"scrollbarAlways\"\r\n          ref=\"scrollbar\"\r\n        >\r\n          <!-- 表格 -->\r\n          <table\r\n            :class=\"`${prefixCls}-body`\"\r\n            :style=\"tableBodyStyle\"\r\n            cellspacing=\"0\"\r\n            cellpadding=\"0\"\r\n            border=\"0\"\r\n            ref=\"tableBody\"\r\n          >\r\n            <!-- colgroup -->\r\n            <ivue-colgroup\r\n              :columns=\"store.states.columns.value\"\r\n              :table-layout=\"tableLayout\"\r\n            ></ivue-colgroup>\r\n\r\n            <!-- auto 头部 -->\r\n            <table-header\r\n              :border=\"border\"\r\n              :defaultSort=\"defaultSort\"\r\n              :store=\"store\"\r\n              @on-drag-visible=\"handleDragVisible\"\r\n              v-if=\"showHeader && tableLayout === 'auto'\"\r\n            ></table-header>\r\n\r\n            <!-- 内容 -->\r\n            <table-body\r\n              :store=\"store\"\r\n              :stripe=\"stripe\"\r\n              :rowClassName=\"rowClassName\"\r\n              :rowStyle=\"rowStyle\"\r\n              :tooltipTheme=\"tooltipTheme\"\r\n            ></table-body>\r\n          </table>\r\n          <!-- 没有数据 -->\r\n          <div\r\n            v-if=\"isData\"\r\n            :class=\"`${prefixCls}-placeholder`\"\r\n            :style=\"placeholderStyle\"\r\n            ref=\"placeholder\"\r\n          >\r\n            <slot name=\"placeholder\">\r\n              <span :class=\"`${prefixCls}-placeholder--text`\">{{\r\n                placeholder\r\n              }}</span>\r\n            </slot>\r\n          </div>\r\n        </ivue-scrollbar>\r\n      </div>\r\n      <!-- 合计 -->\r\n      <div\r\n        v-if=\"showSummary\"\r\n        v-show=\"!isData\"\r\n        v-mousewheel=\"handleMousewheel\"\r\n        :class=\"`${prefixCls}-footer--wrapper`\"\r\n        ref=\"footer\"\r\n      >\r\n        <table-footer\r\n          :border=\"border\"\r\n          :defaultSort=\"defaultSort\"\r\n          :store=\"store\"\r\n          :style=\"tableStyles\"\r\n          :sum-text=\"sumText\"\r\n          :summary-method=\"summaryMethod\"\r\n        ></table-footer>\r\n      </div>\r\n    </div>\r\n    <!-- 拖拽时的虚线 -->\r\n    <div\r\n      :class=\"`${prefixCls}-column-resize-proxy`\"\r\n      ref=\"draggingDotted\"\r\n      v-show=\"dragging\"\r\n    ></div>\r\n  </div>\r\n</template>\r\n\r\n<script lang=\"ts\">\r\nimport {\r\n  computed,\r\n  defineComponent,\r\n  getCurrentInstance,\r\n  provide,\r\n  onMounted,\r\n} from 'vue';\r\nimport { debounce } from 'lodash-unified';\r\n\r\n// 表格改变\r\nimport TableLayout from './table-layout';\r\n// Mousewheel\r\nimport { Mousewheel } from '../../utils/directives';\r\n\r\n// store\r\nimport { createStore } from './store/helper';\r\n\r\n// 表格style\r\nimport useStyle from './table/styles';\r\nimport useUtils from './table/utils';\r\n\r\n// components\r\nimport IvueColgroup from './colgroup';\r\nimport TableHeader from './table-header';\r\nimport TableBody from './table-body';\r\nimport IvueScrollbar from '../ivue-scrollbar/index.vue';\r\nimport TableFooter from './table-footer';\r\n\r\n// props\r\nimport defaultProps from './table/defaults';\r\n\r\n// ts\r\nimport { Table, TableContextKey } from './table/defaults';\r\nimport type { TableColumnCtx } from './table-column/defaults';\r\n\r\nconst prefixCls = 'ivue-table';\r\nlet tableIdSeed = 1;\r\n\r\nexport default defineComponent({\r\n  name: prefixCls,\r\n  props: defaultProps,\r\n  directives: {\r\n    Mousewheel,\r\n  },\r\n  emits: [\r\n    'on-cell-mouse-enter',\r\n    'on-cell-mouse-leave',\r\n    'on-selection-change',\r\n    'on-select-all',\r\n    'on-select',\r\n    'on-current-change',\r\n    'on-header-click',\r\n    'on-sort-change',\r\n    'on-filter-change',\r\n    'on-header-dragend',\r\n    'on-expand-change',\r\n    'on-cell-click',\r\n    'on-row-click',\r\n  ],\r\n  setup(props) {\r\n    // vm\r\n    const table = getCurrentInstance() as Table;\r\n\r\n    // 设置id\r\n    const tableId = `${prefixCls}-${tableIdSeed++}`;\r\n    table.tableId = tableId;\r\n\r\n    // store\r\n    const store = createStore(table, props);\r\n    table.store = store;\r\n\r\n    // 表格布局\r\n    const layout = new TableLayout({\r\n      // table store\r\n      store: table.store,\r\n      // table vm\r\n      table,\r\n      // 列的宽度是否自撑开\r\n      fit: props.fit,\r\n      // 显示头部\r\n      showHeader: props.showHeader,\r\n    });\r\n\r\n    table.layout = layout;\r\n\r\n    // 表格样式\r\n    const {\r\n      // data\r\n      dragging,\r\n      renderExpanded,\r\n      resizeState,\r\n      tableWidth,\r\n      isGroup,\r\n\r\n      // computed\r\n      tableLayout,\r\n      contentStyles,\r\n      tableStyles,\r\n      placeholderStyle,\r\n      tableBodyStyle,\r\n      scrollbarWrapperStyle,\r\n      scrollbarContentStyle,\r\n\r\n      // methods\r\n      updateLayout,\r\n      handleMouseLeave,\r\n      handleMousewheel,\r\n      handleDragVisible,\r\n      handleBindEvents,\r\n    } = useStyle(props, layout, store, table);\r\n\r\n    // 去抖更新布局\r\n    const debouncedUpdateLayout = debounce(updateLayout, 50);\r\n\r\n    // 表格状态\r\n    table.state = {\r\n      resizeState,\r\n      isGroup,\r\n      updateLayout,\r\n      debouncedUpdateLayout,\r\n    };\r\n\r\n    const {\r\n      // 单选选择当前行\r\n      setCurrentRow,\r\n      // 返回当前选中的行\r\n      getSelectionRows,\r\n      // 多选选择的行\r\n      toggleRowSelection,\r\n      // 清除多选选择行\r\n      clearSelection,\r\n      // 用于清空排序条件，数据会恢复成未排序的状态\r\n      clearSort,\r\n      // 手动排序表格,参数 prop 属性指定排序列 order 指定排序顺序\r\n      sort,\r\n      // 传入由columnKey 组成的数组以清除指定列的过滤条件\r\n      clearFilter,\r\n      // 切换行展开\r\n      toggleRowExpansion,\r\n    } = useUtils(store);\r\n\r\n    // computed\r\n\r\n    // 外层样式\r\n    const wrapperClass = computed(() => {\r\n      return [\r\n        prefixCls,\r\n        `${prefixCls}-layout-${tableLayout.value}`,\r\n        {\r\n          // 列的宽度是否自撑开\r\n          [`${prefixCls}-fit`]: props.fit,\r\n          // \t是否带有纵向边框\r\n          [`${prefixCls}-border`]: props.border || isGroup.value,\r\n          // 是否拥有多级表头\r\n          [`${prefixCls}-group`]: isGroup.value,\r\n          // Table 的最大高度\r\n          [`${prefixCls}-max-height`]: props.maxHeight,\r\n          // 滚动x\r\n          [`${prefixCls}-scroll-x`]: layout.scrollX.value,\r\n          // 滚动y\r\n          [`${prefixCls}-scroll-y`]: layout.scrollY.value,\r\n          // 没有固定列的时使用\r\n          [`${prefixCls}-nofixed-row-hover`]:\r\n            !store.states.isFixedColumns.value,\r\n          // 是否有表格数据\r\n          [`${prefixCls}-nofixed-row-transition`]:\r\n            (store.states.data.value || []).length !== 0 &&\r\n            (store.states.data.value || []).length < 100,\r\n          // 是否在表尾显示合计行\r\n          ['has-footer']: props.showSummary,\r\n          // 是否为斑马纹 table\r\n          [`${prefixCls}-stripe`]: props.stripe,\r\n        },\r\n      ];\r\n    });\r\n\r\n    // 是否有数据\r\n    const isData = computed(() => {\r\n      return (store.states.data.value || []).length === 0;\r\n    });\r\n\r\n    // onMounted\r\n    onMounted(() => {\r\n      // 设置整理后的列设置数据 未扁平化列数据 | 扁平化后的列数据 | 是否有固定列\r\n      store.updateColumns();\r\n\r\n      // 表格宽度\r\n      const el: HTMLElement = table.vnode.el as HTMLElement;\r\n      // 表格头部\r\n      const header: HTMLElement = table.refs.header;\r\n\r\n      // 设置宽度\r\n      tableWidth.value = el.offsetWidth;\r\n\r\n      // 初始化表格大小\r\n      resizeState.value = {\r\n        width: tableWidth.value,\r\n        height: el.offsetHeight,\r\n        headerHeight: props.showHeader && header ? header.offsetHeight : null,\r\n      };\r\n\r\n      // 初始化过滤的数据\r\n      store.states.columns.value.forEach((column: TableColumnCtx) => {\r\n        if (column.filteredValue && column.filteredValue.length) {\r\n          table.store.commit('filterChange', {\r\n            column,\r\n            values: column.filteredValue,\r\n            silent: true,\r\n          });\r\n        }\r\n      });\r\n\r\n      // 初始化完成\r\n      table.$ready = true;\r\n\r\n      // 更新布局\r\n      updateLayout();\r\n\r\n      // 绑定事件 滚动 | 列的宽度自撑开 | 表格大小改变\r\n      handleBindEvents();\r\n    });\r\n\r\n    // provide\r\n    provide(TableContextKey, table);\r\n\r\n    return {\r\n      prefixCls,\r\n\r\n      // data\r\n      dragging,\r\n      renderExpanded,\r\n      resizeState,\r\n      isGroup,\r\n\r\n      // layout\r\n      layout,\r\n      // store\r\n      store,\r\n\r\n      // computed\r\n      isData,\r\n      wrapperClass,\r\n      contentStyles,\r\n      tableLayout,\r\n      tableStyles,\r\n      placeholderStyle,\r\n      tableBodyStyle,\r\n      scrollbarWrapperStyle,\r\n      scrollbarContentStyle,\r\n\r\n      // methods\r\n      handleMouseLeave,\r\n      handleMousewheel,\r\n      handleDragVisible,\r\n      setCurrentRow,\r\n      toggleRowSelection,\r\n      getSelectionRows,\r\n      clearSelection,\r\n      clearSort,\r\n      sort,\r\n      clearFilter,\r\n      toggleRowExpansion,\r\n    };\r\n  },\r\n  components: {\r\n    IvueColgroup,\r\n    TableBody,\r\n    IvueScrollbar,\r\n    TableHeader,\r\n    TableFooter,\r\n  },\r\n});\r\n</script>\r\n"],"names":["_resolveDirective","_openBlock","_createElementBlock","_normalizeClass","_createCommentVNode","_createElementVNode","_normalizeStyle","_renderSlot","_withDirectives","_createVNode","_withCtx","_createBlock"],"mappings":"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"}