@blanderbit/vue3-table-grid
Version:
## Project setup ``` npm install ```
576 lines (486 loc) • 27.1 kB
JavaScript
/******/ (function() { // webpackBootstrap
/******/ "use strict";
/******/ var __webpack_modules__ = ({
/***/ 89:
/***/ (function(__unused_webpack_module, exports) {
var __webpack_unused_export__;
__webpack_unused_export__ = ({
value: true
}); // runtime helper for setting properties on components
// in a tree-shakable way
exports.Z = (sfc, props) => {
const target = sfc.__vccOpts || sfc;
for (const [key, val] of props) {
target[key] = val;
}
return target;
};
/***/ })
/******/ });
/************************************************************************/
/******/ // The module cache
/******/ var __webpack_module_cache__ = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/ // Check if module is in cache
/******/ var cachedModule = __webpack_module_cache__[moduleId];
/******/ if (cachedModule !== undefined) {
/******/ return cachedModule.exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = __webpack_module_cache__[moduleId] = {
/******/ // no module.id needed
/******/ // no module.loaded needed
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/************************************************************************/
/******/ /* webpack/runtime/define property getters */
/******/ !function() {
/******/ // define getter functions for harmony exports
/******/ __webpack_require__.d = function(exports, definition) {
/******/ for(var key in definition) {
/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
/******/ }
/******/ }
/******/ };
/******/ }();
/******/
/******/ /* webpack/runtime/hasOwnProperty shorthand */
/******/ !function() {
/******/ __webpack_require__.o = function(obj, prop) { return Object.prototype.hasOwnProperty.call(obj, prop); }
/******/ }();
/******/
/******/ /* webpack/runtime/make namespace object */
/******/ !function() {
/******/ // 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 });
/******/ };
/******/ }();
/******/
/******/ /* webpack/runtime/publicPath */
/******/ !function() {
/******/ __webpack_require__.p = "";
/******/ }();
/******/
/************************************************************************/
var __webpack_exports__ = {};
// This entry need to be wrapped in an IIFE because it need to be isolated against other modules in the chunk.
!function() {
// ESM COMPAT FLAG
__webpack_require__.r(__webpack_exports__);
// EXPORTS
__webpack_require__.d(__webpack_exports__, {
"VTable": function() { return /* reexport */ src_VTable; }
});
;// CONCATENATED MODULE: ./node_modules/@vue/cli-service/lib/commands/build/setPublicPath.js
/* eslint-disable no-var */
// This file is imported into lib/wc client bundles.
if (typeof window !== 'undefined') {
var currentScript = window.document.currentScript
if (false) { var getCurrentScript; }
var src = currentScript && currentScript.src.match(/(.+\/)[^/]+\.js(\?.*)?$/)
if (src) {
__webpack_require__.p = src[1] // eslint-disable-line
}
}
// Indicate to webpack that this file can be concatenated
/* harmony default export */ var setPublicPath = (null);
;// CONCATENATED MODULE: external {"commonjs":"vue","commonjs2":"vue","root":"Vue"}
var external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject = require("vue");
;// CONCATENATED MODULE: ./src/assets/img/loader.gif
var loader_namespaceObject = __webpack_require__.p + "img/loader.cf25105c.gif";
;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/VTable.vue?vue&type=template&id=76571f61&scoped=true
const _withScopeId = n => ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.pushScopeId)("data-v-76571f61"), n = n(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.popScopeId)(), n);
const _hoisted_1 = {
class: "vt-container"
};
const _hoisted_2 = {
key: 0,
class: "vt-loader-block"
};
const _hoisted_3 = {
key: 0
};
const _hoisted_4 = {
key: 0,
class: "vt-loader-soft"
};
const _hoisted_5 = /*#__PURE__*/_withScopeId(() => /*#__PURE__*/(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("img", {
src: loader_namespaceObject,
alt: ""
}, null, -1));
const _hoisted_6 = {
key: 1
};
const _hoisted_7 = {
key: 0,
class: "vt-loader-hard"
};
const _hoisted_8 = /*#__PURE__*/_withScopeId(() => /*#__PURE__*/(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("img", {
src: loader_namespaceObject,
alt: ""
}, null, -1));
const _hoisted_9 = {
key: 1,
class: "vt-table"
};
const _hoisted_10 = {
key: 0,
class: "vt-checkbox-cell"
};
const _hoisted_11 = {
key: 1
};
const _hoisted_12 = {
key: 0
};
const _hoisted_13 = ["onClick", "onMouseover"];
const _hoisted_14 = {
key: 0,
class: "vt-checkbox-cell"
};
const _hoisted_15 = {
key: 2,
class: "vt-empty-table"
};
const _hoisted_16 = /*#__PURE__*/(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createTextVNode)(" No data provided ");
function render(_ctx, _cache, $props, $setup, $data, $options) {
const _component_VCheckbox = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.resolveComponent)("VCheckbox");
return (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("div", _hoisted_1, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("div", {
class: "vt-table-wrapper",
style: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.normalizeStyle)($setup.styleTableWrapper)
}, [$props.isLoading ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("div", _hoisted_2, [$props.isLoaderSoft ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("div", _hoisted_3, [_ctx.isLoader ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("div", _hoisted_4, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderSlot)(_ctx.$slots, "loader-soft", {}, () => [_hoisted_5], true)])) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true)])) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true), $props.isLoaderHard ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("div", _hoisted_6, [_ctx.isLoader ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("div", _hoisted_7, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderSlot)(_ctx.$slots, "loader-hard", {}, () => [_hoisted_8], true)])) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true)])) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true)])) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true), $setup.isTableVisible ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("table", _hoisted_9, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("thead", {
style: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.normalizeStyle)($setup.styleHeader)
}, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("tr", null, [$setup.showMultiple ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("th", _hoisted_10, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderSlot)(_ctx.$slots, "default", {}, () => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createVNode)(_component_VCheckbox, {
id: "mark-all",
checked: $setup.isMarkedAllCheckboxes,
onCheckboxChanged: $setup.selectAllCheckboxChanged
}, null, 8, ["checked", "onCheckboxChanged"])], true)])) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true), $setup.showSingle && !$setup.showMultiple ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("th", _hoisted_11)) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true), ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(true), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)(external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.Fragment, null, (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderList)($setup.mainColumns, (header, idx) => {
return (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("th", {
key: idx,
class: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.normalizeClass)(header._options.class),
style: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.normalizeStyle)(header._options.style)
}, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderSlot)(_ctx.$slots, header._options.slotName, {
header: header
}, () => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("span", null, (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.toDisplayString)(header.displayName), 1)], true)], 6);
}), 128))])], 4), _ctx.isMainBodyOfTableVisible ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("tbody", _hoisted_12, [((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(true), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)(external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.Fragment, null, (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderList)($setup.rows, (row, rowIndex) => {
return (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("tr", {
key: rowIndex,
onClick: $event => _ctx.$emit('rowClick', row),
onMouseover: $event => $setup.rowHover(row, $event),
style: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.normalizeStyle)($setup.bgStyle)
}, [$setup.showSingle || $setup.showMultiple ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("td", _hoisted_14, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderSlot)(_ctx.$slots, "default", {}, () => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createVNode)(_component_VCheckbox, {
id: rowIndex,
checked: $setup.isMarkedAllCheckboxes || $setup.rowSelectState[rowIndex],
onCheckboxChanged: $setup.selectPrticularLine
}, null, 8, ["id", "checked", "onCheckboxChanged"])], true)])) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true), ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(true), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)(external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.Fragment, null, (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderList)($setup.mainColumns, (header, idx) => {
return (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("td", {
key: idx,
style: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.normalizeStyle)(header._options.style),
class: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.normalizeClass)([{
'vt-table__item--fixed-side': header.fixed
}, {
'empty': header.displayValue === 'empty'
}])
}, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderSlot)(_ctx.$slots, `line-${rowIndex}_cell-${idx}`, {
bodyCell: row[header.displayValue]
}, () => [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("span", null, (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.toDisplayString)(row[header.displayValue]), 1)], true)], 6);
}), 128))], 44, _hoisted_13);
}), 128))])) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true)])) : ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("div", _hoisted_15, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.renderSlot)(_ctx.$slots, "empty-table", {}, () => [_hoisted_16], true)]))], 4)]);
}
;// CONCATENATED MODULE: ./src/components/VTable.vue?vue&type=template&id=76571f61&scoped=true
;// CONCATENATED MODULE: ./src/utils/useLoader.js
function useLoader(isLoaderHard, isLoading) {
const isMainBodyOfTableVisible = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.ref)(null);
if (isLoaderHard && isLoading) {
isMainBodyOfTableVisible.value = false;
} else {
isMainBodyOfTableVisible.value = true;
}
const isLoader = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.ref)(true);
setTimeout(() => {
isLoader.value = false;
isMainBodyOfTableVisible.value = true;
}, 1000);
return {
isMainBodyOfTableVisible,
isLoader
};
}
;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/VCheckbox.vue?vue&type=template&id=1386a8e6&scoped=true
const VCheckboxvue_type_template_id_1386a8e6_scoped_true_withScopeId = n => (_pushScopeId("data-v-1386a8e6"), n = n(), _popScopeId(), n);
const VCheckboxvue_type_template_id_1386a8e6_scoped_true_hoisted_1 = {
class: "vt-checkbox"
};
const VCheckboxvue_type_template_id_1386a8e6_scoped_true_hoisted_2 = ["checked", "id"];
const VCheckboxvue_type_template_id_1386a8e6_scoped_true_hoisted_3 = ["for"];
function VCheckboxvue_type_template_id_1386a8e6_scoped_true_render(_ctx, _cache, $props, $setup, $data, $options) {
return (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("div", VCheckboxvue_type_template_id_1386a8e6_scoped_true_hoisted_1, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("input", {
type: "checkbox",
class: "checkbox-input",
checked: $props.checked,
onChange: _cache[0] || (_cache[0] = (...args) => $setup.onChange && $setup.onChange(...args)),
id: $setup.checkboxId
}, null, 40, VCheckboxvue_type_template_id_1386a8e6_scoped_true_hoisted_2), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("label", {
for: $setup.checkboxId,
class: "checkbox-label"
}, null, 8, VCheckboxvue_type_template_id_1386a8e6_scoped_true_hoisted_3)]);
}
;// CONCATENATED MODULE: ./src/components/VCheckbox.vue?vue&type=template&id=1386a8e6&scoped=true
;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/VCheckbox.vue?vue&type=script&lang=js
/* harmony default export */ var VCheckboxvue_type_script_lang_js = ({
props: {
id: {
type: [Number, String],
required: true
},
checked: {
type: Boolean,
default: false
}
},
emits: ['checkbox-changed'],
setup(props, context) {
const checkboxId = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.computed)(() => {
return `vt-checkbox-id-${props.id}`;
});
const onChange = () => {
context.emit('checkbox-changed', props.checked, props.id);
};
return {
onChange,
checkboxId
};
}
});
;// CONCATENATED MODULE: ./src/components/VCheckbox.vue?vue&type=script&lang=js
;// CONCATENATED MODULE: ./node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-22.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/VCheckbox.vue?vue&type=style&index=0&id=1386a8e6&lang=scss&scoped=true
// extracted by mini-css-extract-plugin
;// CONCATENATED MODULE: ./src/components/VCheckbox.vue?vue&type=style&index=0&id=1386a8e6&lang=scss&scoped=true
// EXTERNAL MODULE: ./node_modules/vue-loader/dist/exportHelper.js
var exportHelper = __webpack_require__(89);
;// CONCATENATED MODULE: ./src/components/VCheckbox.vue
;
const __exports__ = /*#__PURE__*/(0,exportHelper/* default */.Z)(VCheckboxvue_type_script_lang_js, [['render',VCheckboxvue_type_template_id_1386a8e6_scoped_true_render],['__scopeId',"data-v-1386a8e6"]])
/* harmony default export */ var VCheckbox = (__exports__);
;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/VTable.vue?vue&type=script&lang=js
/* harmony default export */ var VTablevue_type_script_lang_js = ({
name: 'main-table',
components: {
VCheckbox: VCheckbox
},
props: {
dataSource: {
// Here must be trasmited an array with objects for showing header
type: Array,
default: () => []
},
columns: {
// Here must be trasmited an array with objects for showing main body
type: Array,
default: () => []
},
isLoading: {
// This prop switch off/on loader
type: Boolean,
default: true
},
isLoaderSoft: {
// This prop switch off/on soft loader
type: Boolean,
default: true
},
isLoaderHard: {
// This prop switch off/on hard loader
type: Boolean,
default: false
},
backgroundColor: {
type: String,
default: '#E5FDFD'
},
tableHeight: {
type: String,
default: ''
},
isHeaderSticky: {
type: Boolean,
default: false
},
showSelect: {
type: String,
default: 'default'
}
},
emits: ['rowClick', 'mouseHover', 'selectResult'],
setup(props, ctx) {
/* eslint-disable */
const mainColumns = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.computed)(() => {
return props.columns.filter(header => header.displayValue && header.displayName).map((item, idx, array) => {
return { ...item,
id: idx,
_options: {
// creates class name for header table cell
class: [`vt-col_name-${item.displayValue}`, {
'vt-table__header__item--fixed-side': item.fixed
}, {
'empty': item.displayValue === 'empty'
}],
// creates right line of the table, except for the last column
style: {
borderRight: setRightBorder(item, idx, array),
width: `${item.width}px`,
'min-width': `${item.width}px`,
left: item.fixed ? setLeftMargin() : ''
},
//creates name for slot
slotName: `header-${item.displayValue}-content`
}
};
});
});
/* eslint-enable */
const rows = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.computed)(() => {
return props.dataSource;
});
const showMultiple = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.computed)(() => {
return props.showSelect === 'multiple';
});
const showSingle = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.computed)(() => {
return props.showSelect === 'single' || props.showSelect === 'multiple';
});
const rowSelectState = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.reactive)(Object.fromEntries(new Array(props.dataSource.length).fill('l').map((_, idx) => [idx, false])));
const setRightBorder = (item, idx, array) => {
if (lastFixedTableValue.value === item.displayValue) {
return '1px solid #154555';
}
return idx !== array.length - 1 ? '1px solid #EEF1F2' : '';
};
const lastFixedTableValue = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.computed)(() => {
const fixedColsLength = props.columns.filter(item => item.fixed).length;
const fixedCols = props.columns.filter(item => item.fixed);
if (fixedColsLength) {
return fixedCols[fixedColsLength - 1].displayValue;
}
return null;
});
const setLeftMargin = () => {
/* eslint-disable */
if (setLeftMargin.count === 0) {
setLeftMargin.count++;
return '12px';
}
return `${130 * setLeftMargin.count++}px`;
};
setLeftMargin.count = 0;
const numberOfFixedTables = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.computed)(() => {
return props.columns.filter(item => item.fixed).length;
});
const isTableVisible = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.computed)(() => {
return props.dataSource.length && props.columns.length;
});
const rowHover = (rowData, hoverEvent) => {
ctx.emit('mouseHover', rowData, hoverEvent);
};
const bgStyle = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.computed)(() => {
return {
'--bg-color': props.backgroundColor
};
});
const styleTableWrapper = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.computed)(() => {
if (props.tableHeight.length) {
return {
height: props.tableHeight + 'px',
'overflow-y': 'scroll'
};
} else if (numberOfFixedTables.value > 0) {
return {
'margin-left': `${124 * numberOfFixedTables.value}px`
};
}
return {};
});
const styleHeader = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.computed)(() => {
if (props.isHeaderSticky) {
return {
position: 'sticky',
top: 0
};
}
return {};
});
(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.onMounted)(() => {
const table = document.querySelector('.vt-table');
if (!table) return;
const applyFixedColumnsHook = mainColumns.value.some(item => item.fixed);
});
const isMarkedAllCheckboxes = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.ref)(false);
const selectAllCheckboxChanged = val => {
isMarkedAllCheckboxes.value = !val;
if (!val) {
ctx.emit('selectResult', [...props.dataSource]);
}
for (let key in rowSelectState) rowSelectState[key] = !val;
};
const selectPrticularLine = (val, id) => {
isMarkedAllCheckboxes.value = false;
rowSelectState[id] = !val;
let arr = [];
for (let key in rowSelectState) {
if (rowSelectState[key]) {
arr.push(props.dataSource[key]);
}
}
if (arr.length) {
ctx.emit('selectResult', arr);
}
};
return {
mainColumns,
rows,
isTableVisible,
...useLoader(props.isLoaderHard, props.isLoading),
// isMainBodyOfTableVisible, isLoader
rowHover,
bgStyle,
styleTableWrapper,
styleHeader,
isMarkedAllCheckboxes,
selectAllCheckboxChanged,
rowSelectState,
selectPrticularLine,
showMultiple,
showSingle
};
}
});
;// CONCATENATED MODULE: ./src/components/VTable.vue?vue&type=script&lang=js
;// CONCATENATED MODULE: ./node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-22.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/VTable.vue?vue&type=style&index=0&id=76571f61&scoped=true&lang=scss
// extracted by mini-css-extract-plugin
;// CONCATENATED MODULE: ./src/components/VTable.vue?vue&type=style&index=0&id=76571f61&scoped=true&lang=scss
;// CONCATENATED MODULE: ./src/components/VTable.vue
;
const VTable_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(VTablevue_type_script_lang_js, [['render',render],['__scopeId',"data-v-76571f61"]])
/* harmony default export */ var VTable = (VTable_exports_);
;// CONCATENATED MODULE: ./src/index.ts
const src_VTable = VTable;
;// CONCATENATED MODULE: ./node_modules/@vue/cli-service/lib/commands/build/entry-lib-no-default.js
}();
module.exports = __webpack_exports__;
/******/ })()
;
//# sourceMappingURL=vue3-table-grid.common.js.map