vue-admin-core/lib/components/table-select/src/index.js

A Component Library for Vue 3

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var vue = require('vue');
var elementPlus = require('element-plus');
var lodashEs = require('lodash-es');
var select = require('./select.js');
var table = require('./table.js');
var cacheOptions = require('./cache-options.js');
var pagination = require('./pagination.js');

var TableSelect = vue.defineComponent({
  name: "VacTableSelect",
  props: {
    ...elementPlus.ElSelect.props,
    ...elementPlus.ElTable.props,
    ...elementPlus.ElPagination.props,
    /**
     * 表格最大高度
     */
    maxHeight: {
      type: [String, Number],
      default: () => 240
    },
    /**
     * 表格列
     */
    columns: {
      type: Array,
      default: () => []
    },
    props: {
      type: Object,
      default: () => ({
        children: "children",
        label: "label",
        value: "value",
        disabled: "disabled"
      })
    }
  },
  setup(props, context) {
    const {
      expose
    } = context;
    const select$1 = vue.ref();
    const table$1 = vue.ref();
    const pagination$1 = vue.ref();
    const key = vue.computed(() => props.props.value || props.valueKey || props.nodeKey || "value");
    const currentPage = vue.toRef(props.currentPage || 1);
    const {
      cacheOptions: cacheOptions$1,
      setOptionProxy,
      filter,
      tableProps
    } = table.useTable(props, context, {
      select: select$1,
      table: table$1,
      key,
      currentPage
    });
    const selectProps = select.useSelect(props, context, {
      select: select$1,
      table: table$1,
      pagination: pagination$1,
      key,
      filter,
      currentPage
    });
    const paginationProps = pagination.usePagination(props, context, {
      select: select$1,
      table: table$1,
      key,
      filter,
      currentPage
    });
    const Columns = [props.columns.map(({
      slots,
      ...reset
    }, index) => vue.h(elementPlus.ElTableColumn, vue.reactive({
      key: `${reset.prop}-${index}`,
      ...reset
    }), slots))];
    if (props.multiple) {
      Columns.unshift(vue.h(elementPlus.ElTableColumn, {
        width: 30,
        key: "selection",
        type: "selection"
      }));
    }
    const methods = vue.reactive({});
    expose(methods);
    vue.onMounted(() => {
      Object.assign(methods, {
        ...lodashEs.pick(table$1.value, ["clearSelection", "getSelectionRows", "toggleRowSelection", "toggleAllSelection", "toggleRowExpansion", "setCurrentRow", "clearSort", "clearFilter", "doLayout", "sort", "scrollTo", "setScrollTop", "setScrollLeft"]),
        ...lodashEs.pick(select$1.value, ["focus", "blur"])
      });
    });
    return () => {
      return vue.h(elementPlus.ElSelect, vue.reactive({
        ...selectProps,
        modelValue: props.modelValue,
        ref: (ref2) => select$1.value = ref2
      }), {
        ...context.slots,
        default: () => [vue.h(cacheOptions.default, {
          data: cacheOptions$1.value
        }), cacheOptions$1.value.map(({
          value,
          currentLabel,
          isDisabled
        }) => {
          return vue.h(elementPlus.ElOption, {
            label: currentLabel,
            value,
            disabled: isDisabled,
            style: {
              display: "none"
            },
            ref: (vm) => setOptionProxy(value, vm)
          });
        }), vue.withDirectives(vue.h(elementPlus.ElTable, vue.reactive({
          ...tableProps,
          ref: (ref2) => table$1.value = ref2
        }), {
          default: () => Columns
        }), [[elementPlus.ElLoading.directive, props.loading]]), vue.h(elementPlus.ElPagination, vue.reactive({
          ...paginationProps,
          ref: (ref2) => pagination$1.value = ref2
        }), {})]
      });
    };
  }
});

exports.default = TableSelect;
//# sourceMappingURL=index.js.map