element-nice-ui
Version:
A Component Library for Vue.js.
1,536 lines (1,410 loc) • 95.5 kB
JavaScript
module.exports =
/******/ (function(modules) { // webpackBootstrap
/******/ // The module cache
/******/ var installedModules = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/
/******/ // Check if module is in cache
/******/ if(installedModules[moduleId]) {
/******/ return installedModules[moduleId].exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = installedModules[moduleId] = {
/******/ i: moduleId,
/******/ l: false,
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ // Flag the module as loaded
/******/ module.l = true;
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = modules;
/******/
/******/ // expose the module cache
/******/ __webpack_require__.c = installedModules;
/******/
/******/ // define getter function for harmony exports
/******/ __webpack_require__.d = function(exports, name, getter) {
/******/ if(!__webpack_require__.o(exports, name)) {
/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter });
/******/ }
/******/ };
/******/
/******/ // define __esModule on exports
/******/ __webpack_require__.r = function(exports) {
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ }
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/
/******/ // create a fake namespace object
/******/ // mode & 1: value is a module id, require it
/******/ // mode & 2: merge all properties of value into the ns
/******/ // mode & 4: return value when already ns object
/******/ // mode & 8|1: behave like require
/******/ __webpack_require__.t = function(value, mode) {
/******/ if(mode & 1) value = __webpack_require__(value);
/******/ if(mode & 8) return value;
/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
/******/ var ns = Object.create(null);
/******/ __webpack_require__.r(ns);
/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value });
/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
/******/ return ns;
/******/ };
/******/
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __webpack_require__.n = function(module) {
/******/ var getter = module && module.__esModule ?
/******/ function getDefault() { return module['default']; } :
/******/ function getModuleExports() { return module; };
/******/ __webpack_require__.d(getter, 'a', getter);
/******/ return getter;
/******/ };
/******/
/******/ // Object.prototype.hasOwnProperty.call
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
/******/
/******/ // __webpack_public_path__
/******/ __webpack_require__.p = "/dist/";
/******/
/******/
/******/ // Load entry module and return exports
/******/ return __webpack_require__(__webpack_require__.s = 180);
/******/ })
/************************************************************************/
/******/ ({
/***/ 118:
/***/ (function(module, exports) {
module.exports = require("element-nice-ui/lib/dropdown");
/***/ }),
/***/ 119:
/***/ (function(module, exports) {
module.exports = require("element-nice-ui/lib/radio");
/***/ }),
/***/ 165:
/***/ (function(module, exports) {
module.exports = require("vuedraggable");
/***/ }),
/***/ 166:
/***/ (function(module, exports) {
module.exports = require("element-nice-ui/lib/radio-group");
/***/ }),
/***/ 167:
/***/ (function(module, exports) {
module.exports = require("element-nice-ui/lib/radio-button");
/***/ }),
/***/ 168:
/***/ (function(module, exports) {
module.exports = require("ts-web-cache");
/***/ }),
/***/ 18:
/***/ (function(module, exports) {
module.exports = require("vue");
/***/ }),
/***/ 180:
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
// ESM COMPAT FLAG
__webpack_require__.r(__webpack_exports__);
// CONCATENATED MODULE: ./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib/loaders/templateLoader.js??ref--5!./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib??vue-loader-options!./packages/new-table/src/table.vue?vue&type=template&id=88caf7a6
var render = function render() {
var _vm = this,
_c = _vm._self._c
return _c(
"div",
{
ref: "table",
class: ["el-new-table", `el-new-table--${_vm.$data._layout.size}`],
style: _vm.tableStyle,
},
[
_vm.$slots.searcher
? _c("el-table-searcher", [_vm._t("searcher")], 2)
: _vm._e(),
_vm.showTools ? _c("el-table-tools", [_vm._t("tools")], 2) : _vm._e(),
_c("ElTableMain"),
_vm.pagination
? _c("ElTablePagination", { ref: "pagination" })
: _vm._e(),
_vm._t("outer"),
],
2
)
}
var staticRenderFns = []
render._withStripped = true
// CONCATENATED MODULE: ./packages/new-table/src/table.vue?vue&type=template&id=88caf7a6
// CONCATENATED MODULE: ./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib/loaders/templateLoader.js??ref--5!./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib??vue-loader-options!./packages/new-table/src/table-searcher.vue?vue&type=template&id=80fd2096
var table_searchervue_type_template_id_80fd2096_render = function render() {
var _vm = this,
_c = _vm._self._c
return _c(
"div",
{
ref: "searcher",
staticClass: "el-new-table__searcher",
on: {
keyup: function ($event) {
if (
!$event.type.indexOf("key") &&
_vm._k($event.keyCode, "enter", 13, $event.key, "Enter")
)
return null
return _vm.onKeyup.apply(null, arguments)
},
},
},
[
_c(
"div",
{
ref: "left",
staticClass: "el-new-table__searcher-left",
style: {
"white-space": _vm.expanded ? "normal" : "nowrap",
},
},
[
_vm.$slots.default
? _vm._l(_vm.$slots.default, function (node, index) {
return _c("searcher-render", {
key: index,
attrs: {
width: _vm.queryItemWidth,
node: node,
ctx: _vm.ctx,
"label-width": 80,
},
})
})
: _vm._e(),
],
2
),
_c(
"div",
{ staticClass: "el-new-table__searcher-right" },
[
_vm.expandBtnVisible
? _c(
"el-btn",
{
staticStyle: { "margin-left": "10px" },
attrs: {
size: _vm.layout.size,
type: "text",
icon: _vm.expanded ? "arrow-up" : "arrow-down",
},
on: { click: _vm.toggleSearcher },
},
[
_vm._v(
"\n " +
_vm._s(_vm.expanded ? "收起" : "展开") +
"\n "
),
]
)
: _vm._e(),
_c("el-btn", {
attrs: {
size: _vm.layout.size,
type: "primary",
title: "查询",
circle: "",
icon: "search",
},
on: { click: _vm.fetch },
}),
_c("el-btn", {
attrs: {
size: _vm.layout.size,
type: "danger",
title: "重置",
circle: "",
icon: "refresh",
},
on: { click: _vm.refresh },
}),
],
1
),
]
)
}
var table_searchervue_type_template_id_80fd2096_staticRenderFns = []
table_searchervue_type_template_id_80fd2096_render._withStripped = true
// CONCATENATED MODULE: ./packages/new-table/src/table-searcher.vue?vue&type=template&id=80fd2096
// EXTERNAL MODULE: external "element-nice-ui/lib/btn"
var btn_ = __webpack_require__(21);
var btn_default = /*#__PURE__*/__webpack_require__.n(btn_);
// EXTERNAL MODULE: external "element-nice-ui/lib/context"
var context_ = __webpack_require__(37);
var context_default = /*#__PURE__*/__webpack_require__.n(context_);
// CONCATENATED MODULE: ./packages/new-table/src/searcher-render.jsx
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(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
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); }
/* harmony default export */ var searcher_render = ({
functional: true,
props: {
node: {
type: Object,
required: true
},
ctx: {
type: Object,
required: true
},
width: {
type: [Number, String],
required: true
}
},
render(h, _ref) {
let {
props
} = _ref;
let {
componentOptions: opts,
data
} = props.node;
if (data) {
let {
attrs
} = data;
if (opts) {
opts.propsData = _objectSpread(_objectSpread({}, props.ctx), opts.propsData);
}
if (attrs['t-label']) {
let itemStyle = {
width: (props.width + 'px').replace('pxpx', 'px')
};
if (attrs['t-width']) {
itemStyle.width = (attrs['t-width'] + 'px').replace('pxpx', 'px');
}
return h("div", {
"class": "el-new-table__query-item",
"style": itemStyle
}, [h("label", {
"class": "el-new-table__query-label"
}, [attrs['t-label']]), props.node]);
}
}
return props.node;
}
});
// EXTERNAL MODULE: external "throttle-debounce/debounce"
var debounce_ = __webpack_require__(28);
var debounce_default = /*#__PURE__*/__webpack_require__.n(debounce_);
// CONCATENATED MODULE: ./node_modules/.pnpm/babel-loader@8.4.1_@babel+core@7.28.0_webpack@4.47.0/node_modules/babel-loader/lib!./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib??vue-loader-options!./packages/new-table/src/table-searcher.vue?vue&type=script&lang=js
/* harmony default export */ var table_searchervue_type_script_lang_js = ({
name: 'ElTableSearcher',
components: {
ElBtn: btn_default.a,
ElContext: context_default.a,
SearcherRender: searcher_render
},
inject: ['layout', 'model'],
data() {
return {
expanded: false,
expandBtnVisible: false
};
},
computed: {
ctx() {
return {
size: this.layout.size
};
},
queryItemWidth() {
return this.layout.$data._queryItemWidth;
}
},
methods: {
onKeyup() {
this.model.fetchData();
},
toggleSearcher() {
this.expanded = !this.expanded;
this.$nextTick(() => {
this.layout.computeMainHeight();
});
},
resizeHandler: debounce_default()(150, function () {
let leftDom = this.$refs['left'];
if (this.expanded === false) {
if (leftDom.scrollWidth > leftDom.offsetWidth) {
this.expandBtnVisible = true;
} else {
this.expandBtnVisible = false;
}
}
}),
addEvent() {
let leftDom = this.$refs['left'];
if (!leftDom) return;
window.addEventListener('resize', this.resizeHandler);
},
fetch() {
this.model.fetchData();
},
refresh() {
this.model.resetQuery();
}
},
mounted() {
this.layout.refDom('searcher', this.$refs.searcher);
this.resizeHandler();
this.addEvent();
},
beforeDestroy() {
window.removeEventListener('resize', this.resizeHandler);
}
});
// CONCATENATED MODULE: ./packages/new-table/src/table-searcher.vue?vue&type=script&lang=js
/* harmony default export */ var src_table_searchervue_type_script_lang_js = (table_searchervue_type_script_lang_js);
// EXTERNAL MODULE: ./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib/runtime/componentNormalizer.js
var componentNormalizer = __webpack_require__(2);
// CONCATENATED MODULE: ./packages/new-table/src/table-searcher.vue
/* normalize component */
var component = Object(componentNormalizer["a" /* default */])(
src_table_searchervue_type_script_lang_js,
table_searchervue_type_template_id_80fd2096_render,
table_searchervue_type_template_id_80fd2096_staticRenderFns,
false,
null,
null,
null
)
/* harmony default export */ var table_searcher = (component.exports);
// CONCATENATED MODULE: ./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib/loaders/templateLoader.js??ref--5!./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib??vue-loader-options!./packages/new-table/src/table-tools.vue?vue&type=template&id=abe69b0e
var table_toolsvue_type_template_id_abe69b0e_render = function render() {
var _vm = this,
_c = _vm._self._c
return _c(
"div",
{ ref: "tools", staticClass: "el-new-table__tools" },
[
_c(
"el-context",
{
staticClass: "el-new-table__tools-left",
attrs: { ctx: { size: _vm.layout.size } },
},
[_vm._t("default")],
2
),
_c(
"div",
{ staticClass: "el-new-table__tools-right" },
[
_c(
"el-tooltip",
{ attrs: { content: "恢复默认", placement: "top" } },
[
_c("el-btn", {
attrs: { size: _vm.layout.size, icon: "refresh", circle: "" },
on: { click: _vm.deleteRecord },
}),
],
1
),
_c(
"el-tooltip",
{ attrs: { content: "尺寸设置", placement: "top" } },
[
_c(
"el-popover",
{
attrs: { "popper-class": "el-new-table__size-config" },
scopedSlots: _vm._u([
{
key: "reference",
fn: function () {
return [
_c("el-btn", {
attrs: {
size: _vm.layout.size,
icon: "s-operation",
circle: "",
},
}),
]
},
proxy: true,
},
]),
model: {
value: _vm.sizeConfVisible,
callback: function ($$v) {
_vm.sizeConfVisible = $$v
},
expression: "sizeConfVisible",
},
},
[
_c(
"ul",
_vm._l(_vm.sizes, function (size) {
return _c(
"li",
{
key: size.value,
class: {
"el-new-table__size-item--selected":
size.value === _vm.layout.size,
},
on: {
click: function ($event) {
return _vm.changeSize(size.value)
},
},
},
[
_vm._v(
"\n " +
_vm._s(size.label) +
"\n "
),
]
)
}),
0
),
]
),
],
1
),
_c("ColumnsSetting"),
],
1
),
],
1
)
}
var table_toolsvue_type_template_id_abe69b0e_staticRenderFns = []
table_toolsvue_type_template_id_abe69b0e_render._withStripped = true
// CONCATENATED MODULE: ./packages/new-table/src/table-tools.vue?vue&type=template&id=abe69b0e
// EXTERNAL MODULE: external "element-nice-ui/lib/popover"
var popover_ = __webpack_require__(48);
var popover_default = /*#__PURE__*/__webpack_require__.n(popover_);
// EXTERNAL MODULE: external "element-nice-ui/lib/dropdown"
var dropdown_ = __webpack_require__(118);
var dropdown_default = /*#__PURE__*/__webpack_require__.n(dropdown_);
// EXTERNAL MODULE: external "element-nice-ui/lib/tooltip"
var tooltip_ = __webpack_require__(38);
var tooltip_default = /*#__PURE__*/__webpack_require__.n(tooltip_);
// CONCATENATED MODULE: ./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib/loaders/templateLoader.js??ref--5!./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib??vue-loader-options!./packages/new-table/src/table-tools/columns-setting.vue?vue&type=template&id=ed5935ca
var columns_settingvue_type_template_id_ed5935ca_render = function render() {
var _vm = this,
_c = _vm._self._c
return _c(
"el-tooltip",
{ attrs: { content: "列设置", placement: "top" } },
[
_c(
"el-popover",
{
attrs: {
"popper-class": "el-new-table__column-config",
placement: "bottom",
},
scopedSlots: _vm._u([
{
key: "reference",
fn: function () {
return [
_c("el-btn", {
attrs: {
size: _vm.layout.size,
icon: "setting",
circle: "",
},
}),
]
},
proxy: true,
},
]),
model: {
value: _vm.visible,
callback: function ($$v) {
_vm.visible = $$v
},
expression: "visible",
},
},
[
_c(
"div",
{ staticClass: "el-new-table__column-config-header" },
[
_c(
"el-checkbox",
{
attrs: { indeterminate: _vm.indeterminate },
on: { input: _vm.changeAllColumnsVisible },
model: {
value: _vm.allColumnsVisible,
callback: function ($$v) {
_vm.allColumnsVisible = $$v
},
expression: "allColumnsVisible",
},
},
[_vm._v("\n 全选\n ")]
),
],
1
),
_c(
"vue-draggable",
_vm._b(
{
staticStyle: {
"max-height": "250px",
width: "300px",
overflow: "auto",
},
attrs: { tag: "div", value: _vm.column.allColumns },
on: {
input: _vm.onColumnReorder,
start: function ($event) {
_vm.dragging = true
},
end: function ($event) {
_vm.dragging = false
},
},
},
"vue-draggable",
_vm.$data._dragOptions,
false
),
[
_c(
"transition-group",
{ attrs: { tag: "ul", type: "transition" } },
_vm._l(_vm.column.allColumns, function (column) {
return _c(
"li",
{ key: column._id },
[
_c("i", { staticClass: "el-icon-rank handle" }),
_c(
"el-checkbox",
{
attrs: { value: column.visible },
on: {
input: function ($event) {
return _vm.changeColumnsVisibility(column, $event)
},
},
},
[
_vm._v(
"\n " +
_vm._s(column.label) +
"\n "
),
]
),
_c(
"span",
{ staticStyle: { float: "right" } },
[
_c(
"el-tooltip",
{
attrs: {
enterable: false,
placement: "top-end",
content: "固定到左侧",
},
},
[
_c("i", {
class: [
"el-icon-caret-left",
column.fixed === "left" && "column-fixed",
],
on: {
click: function ($event) {
return _vm.changeColumnFixed(column, "left")
},
},
}),
]
),
_c(
"el-tooltip",
{
attrs: {
enterable: false,
placement: "top-end",
content: "固定到右侧",
},
},
[
_c("i", {
class: [
"el-icon-caret-right",
column.fixed === "right" && "column-fixed",
],
on: {
click: function ($event) {
return _vm.changeColumnFixed(
column,
"right"
)
},
},
}),
]
),
],
1
),
],
1
)
}),
0
),
],
1
),
],
1
),
],
1
)
}
var columns_settingvue_type_template_id_ed5935ca_staticRenderFns = []
columns_settingvue_type_template_id_ed5935ca_render._withStripped = true
// CONCATENATED MODULE: ./packages/new-table/src/table-tools/columns-setting.vue?vue&type=template&id=ed5935ca
// EXTERNAL MODULE: external "vuedraggable"
var external_vuedraggable_ = __webpack_require__(165);
var external_vuedraggable_default = /*#__PURE__*/__webpack_require__.n(external_vuedraggable_);
// EXTERNAL MODULE: external "element-nice-ui/lib/checkbox"
var checkbox_ = __webpack_require__(26);
var checkbox_default = /*#__PURE__*/__webpack_require__.n(checkbox_);
// EXTERNAL MODULE: external "element-nice-ui/lib/checkbox-group"
var checkbox_group_ = __webpack_require__(71);
var checkbox_group_default = /*#__PURE__*/__webpack_require__.n(checkbox_group_);
// EXTERNAL MODULE: external "element-nice-ui/lib/perfect-scrollbar"
var perfect_scrollbar_ = __webpack_require__(47);
var perfect_scrollbar_default = /*#__PURE__*/__webpack_require__.n(perfect_scrollbar_);
// CONCATENATED MODULE: ./node_modules/.pnpm/babel-loader@8.4.1_@babel+core@7.28.0_webpack@4.47.0/node_modules/babel-loader/lib!./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib??vue-loader-options!./packages/new-table/src/table-tools/columns-setting.vue?vue&type=script&lang=js
/* harmony default export */ var columns_settingvue_type_script_lang_js = ({
components: {
VueDraggable: external_vuedraggable_default.a,
ElTooltip: tooltip_default.a,
ElCheckbox: checkbox_default.a,
ElCheckboxGroup: checkbox_group_default.a,
ElPerfectScrollbar: perfect_scrollbar_default.a,
ElPopover: popover_default.a,
ElBtn: btn_default.a
},
inject: ['layout', 'column'],
data: () => ({
// sortable的参数
_dragOptions: {
animation: 200,
group: 'description',
ghostClass: 'column-item__ghost',
handle: '.el-icon-rank.handle'
},
dragging: false,
visible: false,
allColumnsVisible: false,
indeterminate: false
}),
watch: {
'column.allColumns'(columns) {
this.computeColumnsCheckStatus(columns);
}
},
methods: {
layoutAndSave() {
this.column.setColumnsLayout();
this.column.save();
},
onColumnReorder(newList) {
this.column.allColumns = newList;
this.layoutAndSave();
},
changeColumnsVisibility(column, columnVisible) {
column.visible = columnVisible;
this.computeColumnsCheckStatus(this.column.allColumns);
this.layoutAndSave();
},
/** 计算列的选中状态 */
computeColumnsCheckStatus(columns) {
// 至少有一个选中为中间态
let indeterminate = false;
// 全部选中
let allColumnsVisible = true;
columns.some(column => {
if (!column.visible) {
allColumnsVisible = false;
} else {
indeterminate = true;
}
return !allColumnsVisible && indeterminate;
});
this.allColumnsVisible = allColumnsVisible;
this.indeterminate = allColumnsVisible ? false : indeterminate;
},
changeAllColumnsVisible(visible) {
this.column.allColumns.forEach(column => {
column.visible = visible;
});
this.layoutAndSave();
},
changeColumnFixed(column, type) {
if (column.fixed === type) {
column.fixed = '';
} else {
column.fixed = type;
}
this.layoutAndSave();
}
}
});
// CONCATENATED MODULE: ./packages/new-table/src/table-tools/columns-setting.vue?vue&type=script&lang=js
/* harmony default export */ var table_tools_columns_settingvue_type_script_lang_js = (columns_settingvue_type_script_lang_js);
// CONCATENATED MODULE: ./packages/new-table/src/table-tools/columns-setting.vue
/* normalize component */
var columns_setting_component = Object(componentNormalizer["a" /* default */])(
table_tools_columns_settingvue_type_script_lang_js,
columns_settingvue_type_template_id_ed5935ca_render,
columns_settingvue_type_template_id_ed5935ca_staticRenderFns,
false,
null,
null,
null
)
/* harmony default export */ var columns_setting = (columns_setting_component.exports);
// CONCATENATED MODULE: ./node_modules/.pnpm/babel-loader@8.4.1_@babel+core@7.28.0_webpack@4.47.0/node_modules/babel-loader/lib!./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib??vue-loader-options!./packages/new-table/src/table-tools.vue?vue&type=script&lang=js
/* harmony default export */ var table_toolsvue_type_script_lang_js = ({
name: 'ElTableTools',
components: {
ElPopover: popover_default.a,
ElBtn: btn_default.a,
ElDropdown: dropdown_default.a,
ElContext: context_default.a,
ElTooltip: tooltip_default.a,
ColumnsSetting: columns_setting
},
inject: ['column', 'layout'],
data: () => ({
sizes: [{
label: '迷你',
value: 'mini'
}, {
label: '小',
value: 'small'
}, {
label: '默认',
value: 'medium'
}, {
label: '大',
value: 'large'
}],
sizeConfVisible: false
}),
methods: {
deleteRecord() {
this.column.delete();
this.column.init();
},
changeSize(size) {
this.layout.size = size;
this.sizeConfVisible = false;
},
onExport() {
this.column.allColumns.filter(column => column.visible && !column);
}
},
mounted() {
this.layout.refDom('tools', this.$refs.tools);
}
});
// CONCATENATED MODULE: ./packages/new-table/src/table-tools.vue?vue&type=script&lang=js
/* harmony default export */ var src_table_toolsvue_type_script_lang_js = (table_toolsvue_type_script_lang_js);
// CONCATENATED MODULE: ./packages/new-table/src/table-tools.vue
/* normalize component */
var table_tools_component = Object(componentNormalizer["a" /* default */])(
src_table_toolsvue_type_script_lang_js,
table_toolsvue_type_template_id_abe69b0e_render,
table_toolsvue_type_template_id_abe69b0e_staticRenderFns,
false,
null,
null,
null
)
/* harmony default export */ var table_tools = (table_tools_component.exports);
// CONCATENATED MODULE: ./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib/loaders/templateLoader.js??ref--5!./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib??vue-loader-options!./packages/new-table/src/table-main.vue?vue&type=template&id=3c88730d
var table_mainvue_type_template_id_3c88730d_render = function render() {
var _vm = this,
_c = _vm._self._c
return _c(
"div",
{
staticClass: "el-new-table__main",
style: { height: _vm.layout.main.height + "px" },
},
[
_c(
"table",
{ staticClass: "el-new-table__table" },
[
_c(
"colgroup",
_vm._l(_vm.cols, function (col) {
return _c("col", {
key: col._id,
ref: "cols",
refInFor: true,
style: {
minWidth: col.minWidth ? col.minWidth + "px" : "",
width: col.width + "px",
},
})
}),
0
),
_c("ElTableHeader"),
_c("ElTableBody"),
],
1
),
_c("transition", { attrs: { name: "el-fade-in" } }, [
_vm.model.loading
? _c("div", { staticClass: "el-new-table__loading" }, [
_c("span", { staticStyle: { color: "var(--primary-color)" } }, [
_vm._v("数据加载中..."),
]),
])
: _vm._e(),
]),
],
1
)
}
var table_mainvue_type_template_id_3c88730d_staticRenderFns = []
table_mainvue_type_template_id_3c88730d_render._withStripped = true
// CONCATENATED MODULE: ./packages/new-table/src/table-main.vue?vue&type=template&id=3c88730d
// EXTERNAL MODULE: external "throttle-debounce"
var external_throttle_debounce_ = __webpack_require__(51);
// EXTERNAL MODULE: external "element-nice-ui/lib/radio-group"
var radio_group_ = __webpack_require__(166);
var radio_group_default = /*#__PURE__*/__webpack_require__.n(radio_group_);
// EXTERNAL MODULE: external "element-nice-ui/lib/radio-button"
var radio_button_ = __webpack_require__(167);
var radio_button_default = /*#__PURE__*/__webpack_require__.n(radio_button_);
// CONCATENATED MODULE: ./node_modules/.pnpm/babel-loader@8.4.1_@babel+core@7.28.0_webpack@4.47.0/node_modules/babel-loader/lib!./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib??vue-loader-options!./packages/new-table/src/table-header.vue?vue&type=script&lang=js
/* harmony default export */ var table_headervue_type_script_lang_js = ({
name: 'ElTableHeader',
components: {
ElRadioGroup: radio_group_default.a,
ElRadioButton: radio_button_default.a,
ElPopover: popover_default.a
},
inject: ['column'],
data: () => ({
_pageX: 0,
_targetCol: null,
_targetColWidth: 0,
_targetColIndex: -1,
resizing: false
}),
methods: {
renderHeaderItem(h, column) {
const scopedSlots = {
reference: () => h("span", [column.label])
};
let popover = h("el-popover", {
"scopedSlots": scopedSlots
}, [h("div", [h("span", {
"style": {
display: 'inline-block',
width: '60px'
}
}, ["\u5BF9\u9F50:"]), h("el-radio-group", {
"attrs": {
"value": column.align,
"size": 'mini'
},
"on": {
"input": v => {
column.align = v;
popover.componentInstance.showPopper = false;
this.column.setColumnsLayout();
this.column.save();
}
}
}, [h("el-radio-button", {
"attrs": {
"label": 'left'
}
}, ["\u5DE6"]), h("el-radio-button", {
"attrs": {
"label": 'center'
}
}, ["\u4E2D"]), h("el-radio-button", {
"attrs": {
"label": 'right'
}
}, ["\u53F3"])])])]);
return popover;
},
/** 渲染左侧固定的表头 */
renderLeftTh(h) {
const {
leftFixedColumns,
extraFixedHeaders
} = this.column;
let baseIndex = extraFixedHeaders.length;
let leftNodes = extraFixedHeaders.concat(leftFixedColumns.map((column, index) => h("th", {
"class": 'el-new-table__left-fixed',
"style": {
left: column._offsetLeft + 'px',
textAlign: column.align
},
"key": column._id
}, [this.renderHeaderItem(h, column), h("div", {
"class": 'el-new-table__handle',
"on": {
"mousedown": e => this.mousedown(e, index + baseIndex)
}
})])));
let last = leftNodes[leftNodes.length - 1];
if (last) {
last.data.class += ' el-new-table__left-last';
}
return leftNodes;
},
/** 渲染右侧固定的表头 */
renderRightTh(h, baseIndex) {
const {
rightFixedColumns
} = this.column;
let rightNodes = rightFixedColumns.map((column, index) => h("th", {
"class": 'el-new-table__right-fixed',
"style": {
right: column._offsetRight + 'px',
textAlign: column.align
},
"key": column._id
}, [this.renderHeaderItem(h, column), h("div", {
"class": 'el-new-table__handle',
"on": {
"mousedown": e => this.mousedown(e, baseIndex + index)
}
})]));
if (rightNodes[0]) {
rightNodes[0].data.class += ' el-new-table__right-first';
}
return rightNodes;
},
mousedown(e, index) {
// 鼠标移动初始路径
this.$data._pageX = e.pageX;
// 目标列的索引
this.$data._targetColIndex = index;
// 目标列
this.$data._targetCol = document.querySelectorAll('.el-new-table__main col')[index];
// 目标列的初始宽度
this.$data._targetColWidth = +this.$data._targetCol.offsetWidth;
// 进入移动状态, 此刻, 鼠标总会显示可移动的样式
this.resizing = true;
document.addEventListener('mousemove', this.mousemove);
document.addEventListener('mouseup', this.mouseup);
},
/** 移动表头, 根据colgroup特性, 表列也会同时呗拖拽为指定宽度 */
mousemove: Object(external_throttle_debounce_["throttle"])(25, false, function (e) {
this.$data._targetCol.style.width = this.$data._targetColWidth + (e.pageX - this.$data._pageX) + 'px';
}),
/** 放开鼠标, 移除鼠标事件, 同时将当前表格列信息存储到idb数据库中 */
mouseup(e) {
document.removeEventListener('mousemove', this.mousemove);
document.removeEventListener('mouseup', this.mouseup);
// TODO 此处是否应该直接引用tableMain中的cols属性
const {
leftFixedColumns,
staticColumns,
rightFixedColumns,
extraColumns
} = this.column;
let cols = extraColumns.concat(leftFixedColumns.concat(staticColumns, rightFixedColumns));
// 将视图中的列宽映射到列数据中
cols[this.$data._targetColIndex].width = parseInt(this.$data._targetCol.style.width);
this.column.setColumnsLayout();
this.column.save();
// 拖拽行为结束, 鼠标指针样式恢复正常样式
this.resizing = false;
}
},
render(h) {
const {
staticColumns
} = this.column;
// 左固定列 为 额为固定列加上需要渲染的左侧固定列
let leftHeaders = this.renderLeftTh(h);
// 静态列
let staticHeaders = staticColumns.map((column, index) => {
return h("th", {
"class": 'el-new-table__static',
"key": column._id,
"style": {
textAlign: column.align
}
}, [this.renderHeaderItem(h, column), h("div", {
"class": 'el-new-table__handle',
"on": {
"mousedown": e => this.mousedown(e, leftHeaders.length + index)
}
})]);
});
// 右固定列
let rightHeaders = this.renderRightTh(h, leftHeaders.length + staticHeaders.length);
return h("thead", {
"class": 'el-new-table__header',
"ref": 'header'
}, [h("tr", {
"class": {
'el-new-table__header--resizing': this.resizing
}
}, [leftHeaders, staticHeaders, rightHeaders])]);
}
});
// CONCATENATED MODULE: ./packages/new-table/src/table-header.vue?vue&type=script&lang=js
/* harmony default export */ var src_table_headervue_type_script_lang_js = (table_headervue_type_script_lang_js);
// CONCATENATED MODULE: ./packages/new-table/src/table-header.vue
var table_header_render, table_header_staticRenderFns
/* normalize component */
var table_header_component = Object(componentNormalizer["a" /* default */])(
src_table_headervue_type_script_lang_js,
table_header_render,
table_header_staticRenderFns,
false,
null,
null,
null
)
/* harmony default export */ var table_header = (table_header_component.exports);
// EXTERNAL MODULE: external "element-nice-ui/lib/radio"
var radio_ = __webpack_require__(119);
var radio_default = /*#__PURE__*/__webpack_require__.n(radio_);
// CONCATENATED MODULE: ./node_modules/.pnpm/babel-loader@8.4.1_@babel+core@7.28.0_webpack@4.47.0/node_modules/babel-loader/lib!./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib??vue-loader-options!./packages/new-table/src/table-row.vue?vue&type=script&lang=js
/* harmony default export */ var table_rowvue_type_script_lang_js = ({
name: 'ElTableRow',
props: {
rowData: {
type: Object,
required: true
},
rowIndex: {
type: Number,
required: true
},
rowRenderQueue: {
type: Object,
required: true
},
rowKey: String
},
inject: ['column'],
data() {
return {
hasSelected: false,
hasChecked: false
};
},
methods: {
/** 渲染额外单元格 */
renderExtraFixedCells() {
const h = this.$createElement;
const {
allColumns,
checkable,
selectable
} = this.column;
// 防止样式出现一瞬间的错乱
if (!allColumns.length) {
return [];
}
const {
rowKey
} = this;
let nodeList = [];
if (rowKey) {
let style = {
'text-align': 'center',
left: nodeList.length ? '60px' : '0px'
};
if (checkable) {
nodeList.push(h("td", {
"class": 'el-new-table__left-fixed',
"style": style
}, [h(checkbox_default.a, {
"attrs": {
"disabled": typeof checkable === 'function' && !checkable(this.rowData, this.rowIndex),
"value": this.hasChecked
},
"on": {
"input": this.onCheck
}
})]));
} else if (selectable) {
nodeList.push(h("td", {
"class": 'el-new-table__left-fixed',
"style": style
}, [h(radio_default.a, {
"attrs": {
"disabled": typeof selectable === 'function' && !selectable(this.rowData, this.rowIndex),
"value": this.hasSelected
},
"on": {
"input": this.onSelect
}
})]));
}
}
return nodeList;
},
/** 复选 */
onCheck(status) {
// 复选选中时 不应该影响其它的行, 不能引起其他行的重新渲染, 否则会造成性能的浪费
this.hasChecked = status;
},
/** 单选 */
onSelect(status) {
this.hasSelected = status;
}
},
render(h) {
const {
rowData,
rowRenderQueue,
rowIndex
} = this;
let extraCells = this.renderExtraFixedCells();
let leftCells = extraCells.concat(rowRenderQueue.left.map(fn => fn(rowData, rowIndex)));
let last = leftCells[leftCells.length - 1];
if (last) {
last.data.class += ' el-new-table__left-last';
}
let staticCells = rowRenderQueue.static.map(fn => fn(rowData, rowIndex));
let rightCells = rowRenderQueue.right.map(fn => fn(rowData, rowIndex));
let first = rightCells[0];
if (first) {
first.data.class += ' el-new-table__right-first';
}
return [h("tr", {
"class": 'el-new-table__row'
}, [leftCells, staticCells, rightCells])];
}
});
// CONCATENATED MODULE: ./packages/new-table/src/table-row.vue?vue&type=script&lang=js
/* harmony default export */ var src_table_rowvue_type_script_lang_js = (table_rowvue_type_script_lang_js);
// CONCATENATED MODULE: ./packages/new-table/src/table-row.vue
var table_row_render, table_row_staticRenderFns
/* normalize component */
var table_row_component = Object(componentNormalizer["a" /* default */])(
src_table_rowvue_type_script_lang_js,
table_row_render,
table_row_staticRenderFns,
false,
null,
null,
null
)
/* harmony default export */ var table_row = (table_row_component.exports);
// CONCATENATED MODULE: ./node_modules/.pnpm/babel-loader@8.4.1_@babel+core@7.28.0_webpack@4.47.0/node_modules/babel-loader/lib!./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib??vue-loader-options!./packages/new-table/src/table-body.vue?vue&type=script&lang=js
/* harmony default export */ var table_bodyvue_type_script_lang_js = ({
name: 'ElTableBody',
components: {
ElTableRow: table_row
},
inject: ['model', 'column', 'root', 'layout'],
data: () => ({
flatData: []
}),
computed: {
// TODO renderQueue
rowRenderQueue() {
const h = this.$createElement;
const {
root
} = this;
const {
leftFixedColumns,
staticColumns,
rightFixedColumns,
showAsTree
} = this.column;
const {
childrenKey
} = this.model;
const {
size
} = this.layout;
let getExpandPadding = (column, row) => {
return [h("i", {
"style": {
'margin-left': row._depth * 20 + 'px'
}
}), row[childrenKey] && row[childrenKey].length ? h("i", {
"class": [row.$_expanded ? 'el-icon-arrow-down' : 'el-icon-arrow-right'],
"on": {
"click": () => this.expand(row)
},
"style": {
cursor: 'pointer'
}
}) : null];
};
let getCellRender = (column, leftColumnIndex) => {
// 如果是树形显示
if (showAsTree && leftColumnIndex === 0) {
if (column.formatter) {
return (rowData, rowIndex) => [getExpandPadding(column, rowData), column.formatter(rowData, rowData[column.prop], rowIndex)];
} else if (column.slotName) {
return (rowData, rowIndex) => {
let fn = root.$scopedSlots["column.".concat(column.slotName)];
return [getExpandPadding(column, rowData), fn ? fn({
row: rowData,
index: rowIndex,
value: rowData[column.prop],
size
}) : '--'];
};
} else {
return rowData => [getExpandPadding(column, rowData), rowData[column.prop]];
}
}
if (column.formatter) {
return (rowData, rowIndex) => [column.formatter(rowData, rowData[column.prop], rowIndex)];
} else if (column.slotName) {
return (rowData, rowIndex) => {
let fn = root.$scopedSlots["column.".concat(column.slotName)];
return [fn ? fn({
row: rowData,
index: rowIndex,
value: rowData[column.prop],
size
}) : '--'];
};
} else {
return rowData => rowData[column.prop];
}
};
// 渲染队列, 直接根据column信息生成每个单元格的渲染队列
let leftRenderQueue = leftFixedColumns.map((column, index) => {
let cellRender = getCellRender(column, index);
let className = 'el-new-table__left-fixed';
return (rowData, rowIndex) => {
return h("td", {
"class": className,
"key": column._id,
"style": {
left: column._offsetLeft + 'px',
textAlign: column.align
}
}, [cellRender(rowData, rowIndex)]);
};
});
let staticRenderQueue = staticColumns.map((column, index) => {
let cellRender = getCellRender(column, leftRenderQueue.length ? undefined : index);
return (rowData, rowIndex) => {
return h("td", {
"class": 'el-new-table__static',
"key": column._id,
"style": {
textAlign: column.align
}
}, [cellRender(rowData, rowIndex)]);
};
});
let rightRenderQueue = rightFixedColumns.map(column => {
let cellRender = getCellRender(column);
let className = 'el-new-table__right-fixed';
return (rowData, rowIndex) => {
return h("td", {
"class": className,
"key": column._id,
"style": {
right: column._offsetRight + 'px',
textAlign: column.align
}
}, [cellRender(rowData, rowIndex)]);
};
});
return {
left: leftRenderQueue,
static: staticRenderQueue,
right: rightRenderQueue
};
}
},
methods: {
expand(item) {
item.$_expanded = !item.$_expanded;
this.getFlatData();
},
getFlatData() {
let ret = [];
const {
childrenKey,
showAsTree
} = this.model;
if (!showAsTree) {
this.flatData = this.model.data;
}
function recurse(data) {
data.forEach((item, i) => {
ret.push(item);
if (item[childrenKey] && item.$_expanded) {
recurse(item[childrenKey]);
}
});
}
recurse(this.model.data);
this.flatData = ret;
}
},
watch: {
'model.data': {
handler() {
this.getFlatData();
},
immediate: true
}
},
render() {
const h = arguments[0];
const flatData = this.flatData;
c