@fe6/water-pro/lib/table-pro/src/components/table-action.js

An enterprise-class UI design language and Vue-based implementation

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _vue = require("vue");

var _iconsVue = require("@ant-design/icons-vue/lib/icons");

var _divider = _interopRequireDefault(require("../../../divider"));

var _button = _interopRequireDefault(require("../../../button"));

var _dropdown = _interopRequireDefault(require("../../../dropdown"));

var _menu = _interopRequireDefault(require("../../../menu"));

var _useConfigInject2 = _interopRequireDefault(require("../../../_util/hooks/useConfigInject"));

var _vueTypes = _interopRequireDefault(require("../../../_util/vue-types"));

var _propsUtil = require("../../../_util/props-util");

var _useTableContext = require("../hooks/use-table-context");

var _const = require("../const");

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

var _default2 = (0, _vue.defineComponent)({
  name: 'ATableAction',
  props: {
    actions: {
      type: Array,
      default: null
    },
    dropDownActions: {
      type: Array,
      default: null
    },
    divider: _vueTypes.default.bool.def(true),
    outside: _vueTypes.default.bool,
    trigger: {
      type: Array,
      default: function _default() {
        return ['click'];
      }
    },
    prefixCls: String
  },
  setup: function setup(props) {
    var _useConfigInject = (0, _useConfigInject2.default)('table-pro-action', props),
        prefixClsNew = _useConfigInject.prefixCls;

    var table = {};

    if (!props.outside) {
      table = (0, _useTableContext.useTableContext)();
    } // const getSize = computed(() => {
    //   const size = table?.getSize?.();
    //   if (size === 'middle' || !size) {
    //     return;
    //   }
    //   if (size === 'default') {
    //     return 'large';
    //   }
    //   return size;
    // });


    var getActions = (0, _vue.computed)(function () {
      return (props.actions || []).map(function (action) {
        var popConfirm = action.popConfirm; // const size = unref(getSize);

        return _extends(_extends(_extends({
          type: 'link'
        }, action), popConfirm || {}), {
          onConfirm: popConfirm === null || popConfirm === void 0 ? void 0 : popConfirm.confirm,
          onCancel: popConfirm === null || popConfirm === void 0 ? void 0 : popConfirm.cancel,
          enable: !!popConfirm
        });
      });
    });
    var getDropList = (0, _vue.computed)(function () {
      return (props.dropDownActions || []).map(function (action, index) {
        var label = action.label;
        return _extends(_extends({}, action), {
          text: label,
          divider: index < props.dropDownActions.length - 1 ? props.divider : false
        });
      });
    });
    var getAlign = (0, _vue.computed)(function () {
      var _a, _b, _c;

      var columns = ((_b = (_a = table) === null || _a === void 0 ? void 0 : _a.getColumns) === null || _b === void 0 ? void 0 : _b.call(_a)) || [];
      var actionColumn = columns.find(function (item) {
        return item.flag === _const.ACTION_COLUMN_FLAG;
      });
      return (_c = actionColumn === null || actionColumn === void 0 ? void 0 : actionColumn.align) !== null && _c !== void 0 ? _c : 'left';
    });
    return {
      prefixClsNew: prefixClsNew,
      getActions: getActions,
      getDropList: getDropList,
      getAlign: getAlign
    };
  },
  render: function render() {
    var _this = this;

    var defaultSlot = [];
    this.getActions.forEach(function (action, index) {
      var itemNode = (0, _vue.createVNode)(_button.default, action, {
        default: function _default() {
          return [action.label];
        }
      });
      defaultSlot.push(itemNode);

      if (_this.divider && index < _this.getActions.length - (_this.dropDownActions && _this.getDropList.length ? 0 : 1)) {
        defaultSlot.push((0, _vue.createVNode)(_divider.default, {
          "type": "vertical"
        }, null));
      }
    });
    var dropDownNode = null;

    if (this.dropDownActions && this.getDropList.length) {
      var dropdownDefault = null;
      var dropdownMoreNode = (0, _propsUtil.getSlot)(this, 'more');

      if (dropdownMoreNode.length) {
        dropdownDefault = dropdownMoreNode;
      } else {
        dropdownDefault = (0, _vue.createVNode)(_button.default, {
          "type": "link",
          "size": "small"
        }, {
          default: function _default() {
            return [(0, _vue.createVNode)(_iconsVue.MoreOutlined, {
              "class": "icon-more"
            }, null)];
          }
        });
      }

      var overlayInnerNode = [];
      this.getDropList.forEach(function (dropItem) {
        overlayInnerNode.push((0, _vue.createVNode)(_menu.default.Item, null, {
          default: function _default() {
            return [(0, _vue.createVNode)("a", {
              "href": "javascript:;",
              "onClick": dropItem.onClick
            }, [dropItem.label])];
          }
        }));
      });
      var overlayNode = (0, _vue.createVNode)(_menu.default, null, {
        default: function _default() {
          return [overlayInnerNode];
        }
      });
      var dropdownSlots = {
        default: function _default() {
          return dropdownDefault;
        },
        overlay: function overlay() {
          return overlayNode;
        }
      };
      dropDownNode = (0, _vue.createVNode)(_dropdown.default, {
        "trigger": this.trigger
      }, dropdownSlots);
    }

    return (0, _vue.createVNode)("div", {
      "class": [this.prefixClsNew, this.getAlign]
    }, [defaultSlot, dropDownNode]);
  }
});

exports.default = _default2;