cyber-web-ui
Version:
spring-cyber前端ui框架
154 lines (153 loc) • 7.05 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _vue = require("vue");
var _index = _interopRequireDefault(require("../icon/index"));
var _store = require("../_utils/store");
var _isWindows = _interopRequireDefault(require("../_utils/is-windows.js"));
var _antDesignVue = require("ant-design-vue");
var _index2 = require("../_utils/index.js");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
var collapseForm = (0, _vue.defineComponent)({
name: "CCollapseForm",
props: {
// 加载中
loading: {
type: Boolean,
default: false
},
// 是否使用收缩功能
shrink: {
type: Boolean,
default: false
},
showReload: {
type: Boolean,
default: true
}
},
setup: function setup(props, _ref) {
var attrs = _ref.attrs,
slots = _ref.slots,
emit = _ref.emit,
expose = _ref.expose;
var rightRef = (0, _vue.ref)();
var collapseRef = (0, _vue.ref)();
var collapseFormState = (0, _vue.reactive)({
showMore: false,
showHidden: false,
resizeSymbol: Symbol('collapse-form')
});
var changeShrink = function changeShrink() {
collapseFormState.showHidden = !collapseFormState.showHidden;
};
var listener = function listener() {
(0, _vue.nextTick)(function () {
var _collapseRef$value;
if ((_collapseRef$value = collapseRef.value) !== null && _collapseRef$value !== void 0 && _collapseRef$value.children) {
var offsetTop = collapseRef.value.offsetTop;
var list = Array.from(collapseRef.value.querySelectorAll(".cyber-collapse-form-item"));
collapseFormState.showMore = list.some(function (item) {
return item.offsetTop > offsetTop;
});
}
});
};
(0, _vue.onMounted)(function () {
(0, _vue.watch)(function () {
return rightRef.value;
}, function () {
listener();
}, {
immediate: true
});
if ((0, _isWindows.default)()) {
// 监听resize
(0, _store.maintainStore)().resizeState[collapseFormState.resizeSymbol] = listener;
}
});
(0, _vue.onUnmounted)(function () {
if ((0, _isWindows.default)()) {
// 取消监听resize
delete (0, _store.maintainStore)().resizeState[collapseFormState.resizeSymbol];
}
});
return function () {
function defaultSlot() {
var _slots$default;
return (0, _index2.filterEmpty)(((_slots$default = slots.default) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots)) || []).map(function (item) {
if (/Select$/.test(item.type.name)) {
item.props = _objectSpread({
getPopupContainer: function getPopupContainer(triggerNode) {
return triggerNode.parentNode.parentNode;
}
}, item.props || {});
}
return (0, _vue.createVNode)("div", {
"class": "cyber-collapse-form-item"
}, [item]);
});
}
function rightSlot() {
var list = (0, _index2.filterEmpty)(slots.right ? slots.right() : []);
if (list.length) return (0, _vue.createVNode)("div", {
"class": "cyber-collapse-form-right",
"ref": rightRef
}, [list]);
}
function reloadSlot() {
if (!props.showReload) return;
return (0, _vue.createVNode)(_antDesignVue.Button, {
"type": "text",
"disabled": props.loading,
"class": "collapse-form-search-button",
"onClick": function onClick() {
if (props.loading) return;
emit("search");
}
}, {
default: function _default() {
return [slots.reloadIcon ? slots.reloadIcon() : (0, _vue.createVNode)(_index.default, {
"icon": "cyber-shuaxin",
"size": "16"
}, null)];
}
});
}
function shrinkSlot() {
if (!props.shrink) return;
return (0, _vue.withDirectives)((0, _vue.createVNode)("div", {
"class": ["cyber-collapse-shrink", {
spread: collapseFormState.showHidden
}],
"onClick": changeShrink
}, [(0, _vue.withDirectives)((0, _vue.createVNode)("span", null, [(0, _vue.createTextVNode)("\u66F4\u591A")]), [[_vue.vShow, !collapseFormState.showHidden]]), (0, _vue.withDirectives)((0, _vue.createVNode)("span", null, [(0, _vue.createTextVNode)("\u6536\u8D77")]), [[_vue.vShow, collapseFormState.showHidden]]), (0, _vue.createVNode)(_index.default, {
"icon": "cyber-collapse",
"size": "16"
}, null)]), [[_vue.vShow, collapseFormState.showMore]]);
}
return (0, _vue.createVNode)("div", {
"class": ["cyber-collapse-form", {
'cyber-collapse-form-shrink': props.shrink
}, {
show: collapseFormState.showHidden
}],
"ref": collapseRef
}, [rightSlot(), (0, _vue.createVNode)("div", {
"class": "cyber-collapse-action-box"
}, [shrinkSlot(), reloadSlot()]), defaultSlot()]);
};
}
});
collapseForm.install = function (app) {
app.component(collapseForm.name, collapseForm);
};
var _default2 = exports.default = collapseForm;