@wocwin/t-ui-plus
Version:
Page level components developed based on Element Plus.
1,151 lines (1,146 loc) • 49 kB
JavaScript
;
Object.defineProperty(exports, '__esModule', { value: true });
var vue = require('vue');
var Icons = require('@element-plus/icons-vue');
var elementPlus = require('element-plus');
var Sortable = require('sortablejs');
require('./TTableColumn.vue.js');
require('./singleEditCell.vue.js');
require('./singleEdit.vue.js');
require('./ColumnSet.vue.js');
require('./renderCol.vue.js');
require('./operator.vue.js');
require('./renderHeader.vue.js');
var useVirtualized = require('./useVirtualized.js');
var useExpose = require('./useExpose.js');
var tableProps = require('./tableProps.js');
var ColumnSet_vue_vue_type_script_setup_true_lang = require('./ColumnSet.vue2.js');
var renderCol_vue_vue_type_script_setup_true_lang = require('./renderCol.vue2.js');
var singleEditCell_vue_vue_type_script_setup_true_lang = require('./singleEditCell.vue2.js');
var singleEdit_vue_vue_type_script_setup_true_lang = require('./singleEdit.vue2.js');
var renderHeader_vue_vue_type_script_setup_true_lang = require('./renderHeader.vue2.js');
var TTableColumn_vue_vue_type_script_setup_true_lang = require('./TTableColumn.vue2.js');
var operator_vue_vue_type_script_setup_true_lang = require('./operator.vue2.js');
const _hoisted_1 = ["element-loading-text"];
const _hoisted_2 = {
key: 0,
class: "header_title"
};
const _hoisted_3 = { key: 0 };
const _hoisted_4 = { key: 1 };
const _hoisted_5 = { class: "toolbar_top" };
const _hoisted_6 = {
key: 0,
class: "title-tip"
};
const _hoisted_7 = { key: 0 };
const _hoisted_8 = { key: 1 };
const _hoisted_9 = { key: 0 };
const _hoisted_10 = { key: 1 };
const _hoisted_11 = {
key: 1,
style: { "display": "inline" }
};
const _hoisted_12 = /* @__PURE__ */ vue.createElementVNode(
"span",
{ style: { "color": "#f56c6c", "font-size": "16px", "margin-right": "3px" } },
"*",
-1
/* HOISTED */
);
const _hoisted_13 = { key: 5 };
const _hoisted_14 = { key: 0 };
var _sfc_main = /* @__PURE__ */ vue.defineComponent({
...{
name: "TTable"
},
__name: "index",
props: tableProps.tableProps,
emits: [
"save",
"page-change",
"handleEvent",
"radioChange",
"rowSort",
"validateError"
],
setup(__props, { expose: __expose, emit: __emit }) {
const {
scrollContainerEl,
updateRenderedItemCache,
updateOffset,
getDom,
saveDATA,
getItemHeightFromCache
} = useVirtualized.useVirtualized();
const {
TTable,
clearSelection,
getSelectionRows,
toggleRowSelection,
toggleAllSelection,
toggleRowExpansion,
setCurrentRow,
clearSort,
clearFilter,
doLayout,
sort,
scrollTo,
setScrollTop,
setScrollLeft
} = useExpose.useExpose();
const props = __props;
let state = vue.reactive({
tableData: props.table.data,
columnSet: [],
copyTableData: []
// 键盘事件
});
const emptyDataRequired = vue.computed(() => {
if (props.isEmptyDataRequired) {
return state.tableData.length > 0;
} else {
return true;
}
});
const radioVal = vue.ref("");
const forbidden = vue.ref(true);
const TTableBox = vue.ref(null);
const columnSetRef = vue.ref(null);
const formRef = vue.ref({});
const handleRef = (el, scope, item) => {
if (el) {
formRef.value[`formRef-${scope.$index}-${item.prop || scope.column.property}`] = el;
}
};
const editTableRef = vue.ref({});
const handleEditTableRef = (el, scope, item) => {
if (el) {
editTableRef.value[`singleEditRef-${scope.$index}-${item.prop || scope.column.property}`] = el;
}
};
const emits = __emit;
const slots = vue.useSlots();
vue.watch(
() => props.table.data,
(val) => {
if (props.useVirtual) {
saveDATA.value = val;
updateRenderData(0);
} else {
state.tableData = val;
}
},
{ deep: true }
);
vue.watch(
() => props.isRowSort,
(val) => {
if (val) {
initSort();
}
}
);
vue.onMounted(() => {
var _a;
if (props.defaultRadioCol) {
defaultRadioSelect(props.defaultRadioCol);
}
initSort();
if (props.useVirtual) {
saveDATA.value = props.table.data;
getDom();
(_a = scrollContainerEl.value) == null ? void 0 : _a.addEventListener("scroll", handleScroll);
}
});
const updateRenderData = (scrollTop) => {
let startIndex = 0;
let offsetHeight = 0;
for (let i = 0; i < saveDATA.value.length; i++) {
offsetHeight += getItemHeightFromCache(i);
if (offsetHeight >= scrollTop) {
startIndex = i;
break;
}
}
state.tableData = saveDATA.value.slice(startIndex, startIndex + props.virtualShowSize);
updateRenderedItemCache(startIndex);
updateOffset(offsetHeight - getItemHeightFromCache(startIndex));
};
const handleScroll = (e) => {
updateRenderData(e.target.scrollTop);
};
vue.onBeforeUnmount(() => {
var _a;
if (props.useVirtual) {
(_a = scrollContainerEl.value) == null ? void 0 : _a.removeEventListener("scroll", handleScroll);
}
});
vue.onUpdated(() => {
TTable.value.doLayout();
});
const defaultRadioSelect = (index) => {
radioVal.value = index;
emits("radioChange", state.tableData[index - 1], radioVal.value);
};
const initSort = () => {
var _a;
if (!props.isRowSort) return;
const el = (_a = TTableBox.value) == null ? void 0 : _a.querySelector(".el-table__body-wrapper tbody");
const handle = props.isRowSortIcon ? ".row_drag" : ".el-table__row";
Sortable.create(el, {
animation: 150,
// 动画
handle,
// 指定拖拽目标，点击此目标才可拖拽元素(此例中设置操作按钮拖拽)
// filter: '.disabled', // 指定不可拖动的类名（el-table中可通过row-class-name设置行的class）
// dragClass: 'dragClass', // 设置拖拽样式类名
// ghostClass: 'ghostClass', // 设置拖拽停靠样式类名
// chosenClass: 'chosenClass', // 设置选中样式类名
onEnd: (evt) => {
const curRow = state.tableData.splice(evt.oldIndex, 1)[0];
state.tableData.splice(evt.newIndex, 0, curRow);
emits("rowSort", state.tableData, evt.oldIndex, evt.newIndex);
}
});
};
const constantEscape = (value, list, key, label) => {
const res = list.find((item) => {
return item[key] === value;
});
return res && res[label];
};
const radioStyleClass = vue.computed(() => {
if (Array.isArray(props.table.firstColumn)) {
return props.table.firstColumn.some((item) => item.type === "radio");
} else {
return props.table.firstColumn && props.table.firstColumn.type === "radio";
}
});
const isEditRules = vue.computed(() => {
return props.table.rules && Object.keys(props.table.rules).length > 0 || props.columns.some((item) => {
var _a;
return (_a = item == null ? void 0 : item.configEdit) == null ? void 0 : _a.rules;
});
});
const renderColumns = vue.computed(() => {
if (state.columnSet.length === 0) {
return props.columns;
}
const columnByProp = props.columns.reduce((acc, cur) => {
acc[cur.prop] = cur;
return acc;
}, {});
return state.columnSet.filter((cur) => !cur.hidden).map((cur) => columnByProp[cur.prop]);
});
const isTableHeader = vue.computed(() => {
return renderColumns.value.some((item) => item.children);
});
const isTableBorder = vue.computed(() => {
return props.columns.some((item) => item.children);
});
const handleKeyup = (event, index, key) => {
if (!props.isKeyup) return;
const copyTableData = JSON.parse(JSON.stringify(state.tableData));
const doms = document.getElementsByClassName(key);
const focusNextElement = (nextIndex) => {
var _a, _b;
const nextDom = ((_a = doms[nextIndex]) == null ? void 0 : _a.getElementsByTagName("input")[0]) || ((_b = doms[nextIndex]) == null ? void 0 : _b.getElementsByTagName("textarea")[0]);
if (nextDom) nextDom.focus();
};
switch (event.keyCode) {
case 38:
if (!index) index = copyTableData.length;
focusNextElement(index - 1);
break;
case 40:
if (index === copyTableData.length - 1) index = -1;
focusNextElement(index + 1);
break;
case 13:
let keyName = props.columns.map((val) => val.prop);
let num = keyName.indexOf(key);
if (num === -1) {
num = 0;
} else if (num === keyName.length - 1) {
if (index === state.copyTableData.length - 1) {
index = 0;
} else {
++index;
}
} else {
++num;
}
let doms2 = document.getElementsByClassName(keyName[num]);
if (doms2.length) {
let dom = doms2[index].getElementsByTagName("input")[0] || doms2[index].getElementsByTagName("textarea")[0];
dom.focus();
}
break;
}
};
const isForbidden = () => {
forbidden.value = false;
setTimeout(() => {
forbidden.value = true;
}, 0);
};
const radioClick = (row, index) => {
forbidden.value = !forbidden.value;
const isCurrentlySelected = radioVal.value === index;
if (isCurrentlySelected) {
radioVal.value = null;
} else {
radioVal.value = index;
}
isForbidden();
emits("radioChange", radioVal.value ? row : null, radioVal.value);
};
const radioHandleChange = (row, index) => {
if (row == null ? void 0 : row.isRadioDisabled) return;
if (props.rowClickRadio) {
return;
}
radioClick(row, index);
};
const rowClick = (row) => {
if (row.isRadioDisabled) return;
if (!props.rowClickRadio) {
return;
}
radioClick(row, state.tableData.indexOf(row) + 1);
};
const clearRadioHandle = () => {
radioVal.value = null;
TTable.value.setCurrentRow(-1);
};
const copyToClipboard = async (text) => {
if (typeof text !== "string" || text.trim() === "") {
throw new Error("\u65E0\u6548\u7684\u590D\u5236\u5185\u5BB9");
}
try {
await navigator.clipboard.writeText(text);
} catch (error) {
if (error.name === "NotAllowedError" || error.name === "SecurityError") {
throw new Error("\u590D\u5236\u5931\u8D25\uFF1A\u6743\u9650\u88AB\u62D2\u7EDD");
} else {
throw new Error("\u590D\u5236\u5931\u8D25\uFF1A\u6D4F\u89C8\u5668\u4E0D\u652F\u6301\u6216\u53D1\u751F\u672A\u77E5\u9519\u8BEF");
}
}
};
const showMessage = (type, message) => {
if (type === "success") {
elementPlus.ElMessage.success(message);
} else {
elementPlus.ElMessage.error(message);
}
};
const cellDblclick = async (row, column) => {
if (!props.isCopy) {
return false;
}
const value = row[column.property];
try {
await copyToClipboard(String(value));
showMessage("success", "\u590D\u5236\u6210\u529F");
} catch (error) {
showMessage("error", error.message || "\u590D\u5236\u5931\u8D25");
}
};
const isShow = (name) => {
return Object.keys(slots).includes(name);
};
const save = () => {
return new Promise((resolve) => {
var _a;
if (!isEditRules.value) {
emits("save", state.tableData);
resolve(state.tableData);
return;
}
let successLength = 0;
let rulesList = [];
let rulesError = [];
let propError = [];
let propLabelError = [];
const refList = Object.keys(formRef.value).filter((item) => item.includes("formRef"));
const arr = renderColumns.value.filter((val) => {
var _a2;
if ((_a2 = val.configEdit) == null ? void 0 : _a2.rules) {
return val;
}
}).map((item) => item.prop);
const arr1 = (_a = props.table.rules && Object.keys(props.table.rules)) != null ? _a : [];
const newArr = [...arr, ...arr1];
newArr.map((val) => {
refList.map((item) => {
if (typeof item === "string" && item.includes(val)) {
rulesList.push(item);
}
});
});
rulesList.map((val) => {
formRef.value[val].validate((valid) => {
if (valid) {
successLength = successLength + 1;
} else {
rulesError.push(val);
}
});
});
setTimeout(() => {
if (successLength == rulesList.length) {
if (isEditRules.value) {
emits("save", state.tableData);
resolve(state.tableData);
}
} else {
rulesError.map((item) => {
newArr.map((val) => {
if (typeof item === "string" && item.includes(val)) {
propError.push(val);
}
});
});
Array.from(new Set(propError)).map((item) => {
renderColumns.value.map((val) => {
if (item === val.prop) {
propLabelError.push(val.label);
}
});
});
emits("validateError", propLabelError);
}
}, 300);
});
};
const handleEvent = ({ type, val }, index) => {
emits("handleEvent", type, val, index);
};
const handlesCurrentChange = (val) => {
emits("page-change", val);
};
const saveMethod = (callback) => {
var _a;
if (!isEditRules.value) {
callback && callback(state.tableData);
return;
}
let successLength = 0;
let rulesList = [];
let rulesError = [];
let propError = [];
let propLabelError = [];
const refList = Object.keys(formRef.value).filter((item) => item.includes("formRef"));
const arr = renderColumns.value.filter((val) => {
var _a2;
if ((_a2 = val.configEdit) == null ? void 0 : _a2.rules) {
return val;
}
}).map((item) => item.prop);
const arr1 = (_a = props.table.rules && Object.keys(props.table.rules)) != null ? _a : [];
const newArr = [...arr, ...arr1];
newArr.map((val) => {
refList.map((item) => {
if (item.includes(val)) {
rulesList.push(item);
}
});
});
rulesList.map((val) => {
formRef.value[val].validate((valid) => {
if (valid) {
successLength = successLength + 1;
} else {
rulesError.push(val);
}
});
});
setTimeout(() => {
if (successLength == rulesList.length) {
if (isEditRules.value) {
callback && callback(state.tableData);
}
} else {
rulesError.map((item) => {
newArr.map((val) => {
if (item.includes(val)) {
propError.push(val);
}
});
});
Array.from(new Set(propError)).map((item) => {
renderColumns.value.map((val) => {
if (item === val.prop) {
propLabelError.push(val.label);
}
});
});
emits("validateError", propLabelError);
}
}, 300);
};
const clearValidate = () => {
const refList = Object.keys(formRef.value).filter((item) => item.includes("formRef"));
refList.length > 0 && refList.map((val) => {
formRef.value[val].clearValidate();
});
};
const resetFields = () => {
const refList = Object.keys(formRef.value).filter((item) => item.includes("formRef"));
refList.length > 0 && refList.map((val) => {
formRef.value[val].resetFields();
});
const refEditList = Object.keys(editTableRef.value).filter((item) => item.includes("singleEditRef"));
refEditList.length > 0 && refEditList.map((val) => {
editTableRef.value[val].resetTselectTableFields();
});
};
const resetTselectTable = () => {
const refEditList = Object.keys(editTableRef.value).filter((item) => item.includes("singleEditRef"));
refEditList.length > 0 && refEditList.map((val) => {
editTableRef.value[val].resetTselectTableFields();
});
};
const reSetColumnSet = () => {
var _a;
return (_a = columnSetRef.value) == null ? void 0 : _a.reSetColumnSet();
};
__expose({
defaultRadioSelect,
clearSelection,
getSelectionRows,
toggleRowSelection,
toggleAllSelection,
toggleRowExpansion,
setCurrentRow,
clearSort,
clearFilter,
doLayout,
sort,
scrollTo,
setScrollTop,
setScrollLeft,
state,
radioVal,
clearValidate,
resetFields,
save,
saveMethod,
reSetColumnSet,
clearRadioHandle,
resetTselectTable
});
return (_ctx, _cache) => {
const _component_el_icon = vue.resolveComponent("el-icon");
const _component_el_table_column = vue.resolveComponent("el-table-column");
const _component_el_radio = vue.resolveComponent("el-radio");
const _component_el_form = vue.resolveComponent("el-form");
const _component_el_table = vue.resolveComponent("el-table");
const _component_el_pagination = vue.resolveComponent("el-pagination");
const _component_el_button = vue.resolveComponent("el-button");
const _directive_loading = vue.resolveDirective("loading");
return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
class: "t-table",
ref_key: "TTableBox",
ref: TTableBox,
"element-loading-text": _ctx.loadingTxt
}, [
vue.createElementVNode(
"div",
{
class: "header_wrap",
style: vue.normalizeStyle({
paddingBottom: _ctx.tableTitle || _ctx.title || isShow("title") || isShow("toolbar") || _ctx.isSlotToolbar || _ctx.columnSetting ? "10px" : 0
})
},
[
_ctx.tableTitle || _ctx.title || _ctx.$slots.title || _ctx.isSlotTitle ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2, [
_ctx.$slots.title || _ctx.isSlotTitle ? vue.renderSlot(_ctx.$slots, "title", { key: 0 }) : (vue.openBlock(), vue.createElementBlock(
vue.Fragment,
{ key: 1 },
[
_ctx.tableTitle ? (vue.openBlock(), vue.createElementBlock(
"span",
_hoisted_3,
vue.toDisplayString(_ctx.tableTitle),
1
/* TEXT */
)) : (vue.openBlock(), vue.createElementBlock(
"span",
_hoisted_4,
vue.toDisplayString(_ctx.title),
1
/* TEXT */
))
],
64
/* STABLE_FRAGMENT */
))
])) : vue.createCommentVNode("v-if", true),
vue.createElementVNode("div", _hoisted_5, [
vue.createCommentVNode(" \u8868\u683C\u5916\u64CD\u4F5C "),
vue.renderSlot(_ctx.$slots, "toolbar"),
vue.createCommentVNode("\u5217\u8BBE\u7F6E\u6309\u94AE"),
vue.createElementVNode(
"div",
{
class: "header_right_wrap",
style: vue.normalizeStyle({
marginLeft: isShow("toolbar") || _ctx.isSlotToolbar ? "12px" : 0
})
},
[
vue.renderSlot(_ctx.$slots, "btn"),
_ctx.columnSetting && !isTableHeader.value ? (vue.openBlock(), vue.createBlock(ColumnSet_vue_vue_type_script_setup_true_lang.default, vue.mergeProps({ key: 0 }, _ctx.$attrs, {
title: _ctx.title || _ctx.tableTitle,
columns: renderColumns.value,
ref_key: "columnSetRef",
ref: columnSetRef,
onColumnSetting: _cache[0] || (_cache[0] = (v) => vue.unref(state).columnSet = v)
}), null, 16, ["title", "columns"])) : vue.createCommentVNode("v-if", true)
],
4
/* STYLE */
)
])
],
4
/* STYLE */
),
isShow("titleTip") ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6, [
vue.renderSlot(_ctx.$slots, "titleTip")
])) : vue.createCommentVNode("v-if", true),
vue.createVNode(_component_el_table, vue.mergeProps({
ref_key: "TTable",
ref: TTable,
data: vue.unref(state).tableData,
class: {
cursor: _ctx.isCopy,
row_sort: _ctx.isRowSort,
row_sort_none: _ctx.isRowSortIcon,
tree_style: _ctx.isTree,
highlightCurrentRow: _ctx.highlightCurrentRow,
radioStyle: radioStyleClass.value,
multile_head_column: isTableHeader.value,
t_table_use_virtual: _ctx.useVirtual
}
}, _ctx.$attrs, {
"highlight-current-row": _ctx.highlightCurrentRow,
border: _ctx.border || _ctx.table.border || isTableBorder.value || _ctx.useVirtual,
onCellDblclick: cellDblclick,
onRowClick: rowClick
}), vue.createSlots({
default: vue.withCtx(() => [
_ctx.isRowSortIcon ? (vue.openBlock(), vue.createBlock(
_component_el_table_column,
vue.normalizeProps(vue.mergeProps({ key: 0 }, {
width: _ctx.rowSortIconBind.width || 55,
"min-width": _ctx.rowSortIconBind["min-width"] || _ctx.rowSortIconBind.minWidth,
label: _ctx.rowSortIconBind.label || "\u62D6\u52A8",
fixed: _ctx.rowSortIconBind.fixed,
align: _ctx.rowSortIconBind.align || _ctx.align,
..._ctx.rowSortIconBind
})),
{
default: vue.withCtx(() => [
vue.createVNode(_component_el_icon, {
class: "row_drag",
color: _ctx.rowSortIconBind.color,
size: _ctx.rowSortIconBind.size
}, {
default: vue.withCtx(() => [
vue.createVNode(vue.unref(Icons.Rank))
]),
_: 1
/* STABLE */
}, 8, ["color", "size"])
]),
_: 1
/* STABLE */
},
16
/* FULL_PROPS */
)) : vue.createCommentVNode("v-if", true),
!Array.isArray(_ctx.table.firstColumn) && _ctx.table.firstColumn ? (vue.openBlock(), vue.createElementBlock(
vue.Fragment,
{ key: 1 },
[
vue.createCommentVNode(" \u590D\u9009\u6846 "),
_ctx.table.firstColumn.type === "selection" ? (vue.openBlock(), vue.createBlock(
_component_el_table_column,
vue.normalizeProps(vue.mergeProps({ key: 0 }, {
type: "selection",
width: _ctx.table.firstColumn.width || 55,
label: _ctx.table.firstColumn.label,
fixed: _ctx.table.firstColumn.fixed,
align: _ctx.table.firstColumn.align || _ctx.align,
"reserve-selection": _ctx.table.firstColumn.isPaging || false,
selectable: _ctx.table.firstColumn.selectable,
..._ctx.table.firstColumn.bind
})),
null,
16
/* FULL_PROPS */
)) : (vue.openBlock(), vue.createBlock(
_component_el_table_column,
vue.normalizeProps(vue.mergeProps({ key: 1 }, {
type: _ctx.table.firstColumn.type,
width: _ctx.table.firstColumn.width || 55,
label: _ctx.table.firstColumn.label || _ctx.table.firstColumn.type === "radio" && "\u5355\u9009" || _ctx.table.firstColumn.type === "index" && "\u5E8F\u53F7" || _ctx.table.firstColumn.type === "expand" && "" || "",
fixed: _ctx.table.firstColumn.fixed,
align: _ctx.table.firstColumn.align || _ctx.align,
..._ctx.table.firstColumn.bind
})),
vue.createSlots({
_: 2
/* DYNAMIC */
}, [
_ctx.table.firstColumn.type !== "selection" ? {
name: "default",
fn: vue.withCtx((scope) => [
_ctx.table.firstColumn.type === "radio" ? (vue.openBlock(), vue.createBlock(_component_el_radio, {
key: 0,
modelValue: radioVal.value,
"onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => radioVal.value = $event),
label: scope.$index + 1,
disabled: scope.row.isRadioDisabled,
onClick: ($event) => radioHandleChange(scope.row, scope.$index + 1)
}, null, 8, ["modelValue", "label", "disabled", "onClick"])) : vue.createCommentVNode("v-if", true),
_ctx.table.firstColumn.type === "index" ? (vue.openBlock(), vue.createElementBlock(
vue.Fragment,
{ key: 1 },
[
_ctx.isPaginationCumulative && _ctx.isShowPagination ? (vue.openBlock(), vue.createElementBlock(
"span",
_hoisted_7,
vue.toDisplayString((_ctx.table.currentPage - 1) * _ctx.table.pageSize + scope.$index + 1),
1
/* TEXT */
)) : (vue.openBlock(), vue.createElementBlock(
"span",
_hoisted_8,
vue.toDisplayString(scope.$index + 1),
1
/* TEXT */
))
],
64
/* STABLE_FRAGMENT */
)) : vue.createCommentVNode("v-if", true),
_ctx.table.firstColumn.type === "expand" ? vue.renderSlot(_ctx.$slots, "expand", {
key: 2,
scope
}) : vue.createCommentVNode("v-if", true)
]),
key: "0"
} : void 0
]),
1040
/* FULL_PROPS, DYNAMIC_SLOTS */
))
],
64
/* STABLE_FRAGMENT */
)) : vue.createCommentVNode("v-if", true),
Array.isArray(_ctx.table.firstColumn) ? (vue.openBlock(true), vue.createElementBlock(
vue.Fragment,
{ key: 2 },
vue.renderList(_ctx.table.firstColumn, (item, index) => {
return vue.openBlock(), vue.createElementBlock(
vue.Fragment,
null,
[
vue.createCommentVNode(" \u590D\u9009\u6846 "),
item.type === "selection" ? (vue.openBlock(), vue.createBlock(
_component_el_table_column,
vue.mergeProps({
key: index + 1
}, {
type: "selection",
width: item.width || 55,
label: item.label,
fixed: item.fixed,
align: item.align || _ctx.align,
"reserve-selection": item.isPaging || false,
selectable: item.selectable,
...item.bind
}),
null,
16
/* FULL_PROPS */
)) : (vue.openBlock(), vue.createBlock(
_component_el_table_column,
vue.mergeProps({
key: index + "k"
}, {
type: item.type,
width: item.width || 55,
label: item.label || item.type === "radio" && "\u5355\u9009" || item.type === "index" && "\u5E8F\u53F7" || item.type === "expand" && "" || "",
fixed: item.fixed,
align: item.align || _ctx.align,
...item.bind
}),
vue.createSlots({
_: 2
/* DYNAMIC */
}, [
item.type !== "selection" ? {
name: "default",
fn: vue.withCtx((scope) => [
item.type === "radio" ? (vue.openBlock(), vue.createBlock(_component_el_radio, {
key: 0,
modelValue: radioVal.value,
"onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => radioVal.value = $event),
label: scope.$index + 1,
disabled: scope.row.isRadioDisabled,
onClick: ($event) => radioHandleChange(scope.row, scope.$index + 1)
}, null, 8, ["modelValue", "label", "disabled", "onClick"])) : vue.createCommentVNode("v-if", true),
item.type === "index" ? (vue.openBlock(), vue.createElementBlock(
vue.Fragment,
{ key: 1 },
[
_ctx.isPaginationCumulative && _ctx.isShowPagination ? (vue.openBlock(), vue.createElementBlock(
"span",
_hoisted_9,
vue.toDisplayString((_ctx.table.currentPage - 1) * _ctx.table.pageSize + scope.$index + 1),
1
/* TEXT */
)) : (vue.openBlock(), vue.createElementBlock(
"span",
_hoisted_10,
vue.toDisplayString(scope.$index + 1),
1
/* TEXT */
))
],
64
/* STABLE_FRAGMENT */
)) : vue.createCommentVNode("v-if", true),
item.type === "expand" ? vue.renderSlot(_ctx.$slots, "expand", {
key: 2,
scope
}) : vue.createCommentVNode("v-if", true)
]),
key: "0"
} : void 0
]),
1040
/* FULL_PROPS, DYNAMIC_SLOTS */
))
],
64
/* STABLE_FRAGMENT */
);
}),
256
/* UNKEYED_FRAGMENT */
)) : vue.createCommentVNode("v-if", true),
(vue.openBlock(true), vue.createElementBlock(
vue.Fragment,
null,
vue.renderList(renderColumns.value, (item, index) => {
return vue.openBlock(), vue.createElementBlock(
vue.Fragment,
null,
[
!item.children ? (vue.openBlock(), vue.createElementBlock(
vue.Fragment,
{ key: 0 },
[
vue.createCommentVNode(" \u5E38\u89C4\u5217 "),
(typeof item.isShowCol == "function" ? item.isShowCol(item) : !item.isShowCol) ? (vue.openBlock(), vue.createBlock(_component_el_table_column, vue.mergeProps(
{
key: index + "i",
type: item.type,
label: item.label,
prop: item.prop,
"min-width": item["min-width"] || item.minWidth,
width: item.width,
sortable: item.sortable || item.sort || _ctx.sortable,
align: item.align || _ctx.align,
fixed: item.fixed,
formatter: item.formatter
},
typeof item.bind == "function" ? item.bind(item) : { "show-overflow-tooltip": true, ...item.bind }
), vue.createSlots({
default: vue.withCtx((scope) => [
vue.createCommentVNode(" render\u6E32\u67D3 "),
item.render ? (vue.openBlock(), vue.createBlock(renderCol_vue_vue_type_script_setup_true_lang.default, {
key: 0,
column: item,
row: scope.row,
render: item.render,
index: scope.$index
}, null, 8, ["column", "row", "render", "index"])) : vue.createCommentVNode("v-if", true),
vue.createCommentVNode(" \u81EA\u5B9A\u4E49\u63D2\u69FD "),
item.slotName ? vue.renderSlot(_ctx.$slots, item.slotName, {
key: 1,
scope
}) : vue.createCommentVNode("v-if", true),
vue.createCommentVNode(" \u5355\u4E2A\u5355\u5143\u683C\u7F16\u8F91 "),
item.canEdit ? (vue.openBlock(), vue.createBlock(_component_el_form, {
key: 2,
model: vue.unref(state).tableData[scope.$index],
rules: isEditRules.value ? _ctx.table.rules : {},
class: vue.normalizeClass(["t_edit_cell_form", {
t_edit_cell_form_rules: isEditRules.value
}]),
ref_for: true,
ref: (el) => handleRef(el, scope, item),
onSubmit: _cache[3] || (_cache[3] = vue.withModifiers(() => {
}, ["prevent"]))
}, {
default: vue.withCtx(() => [
vue.createVNode(singleEditCell_vue_vue_type_script_setup_true_lang.default, vue.mergeProps({
configEdit: item.configEdit,
modelValue: scope.row[item.prop],
"onUpdate:modelValue": ($event) => scope.row[item.prop] = $event,
prop: item.prop,
scope,
indexColumns: index,
ref_for: true,
ref: (el) => handleEditTableRef(el, scope, item),
onHandleEvent: ($event) => handleEvent($event, scope.$index),
onKeyupHandle: handleKeyup
}, _ctx.$attrs), vue.createSlots({
_: 2
/* DYNAMIC */
}, [
vue.renderList(vue.unref(slots), (_index, name) => {
return {
name,
fn: vue.withCtx((data) => [
vue.renderSlot(_ctx.$slots, name, vue.normalizeProps(vue.guardReactiveProps(data)))
])
};
})
]), 1040, ["configEdit", "modelValue", "onUpdate:modelValue", "prop", "scope", "indexColumns", "onHandleEvent"])
]),
_: 2
/* DYNAMIC */
}, 1032, ["model", "rules", "class"])) : vue.createCommentVNode("v-if", true),
vue.createCommentVNode(" \u5355\u51FB\u5355\u5143\u683C\u7F16\u8F91 "),
item.isClickEdit ? (vue.openBlock(), vue.createBlock(singleEdit_vue_vue_type_script_setup_true_lang.default, vue.mergeProps({
key: 3,
isClickEdit: item.isClickEdit,
configEdit: item.configEdit,
modelValue: scope.row[scope.column.property],
"onUpdate:modelValue": ($event) => scope.row[scope.column.property] = $event
}, _ctx.$attrs, {
ref_for: true,
ref: "editClickCell"
}), vue.createSlots({
_: 2
/* DYNAMIC */
}, [
vue.renderList(vue.unref(slots), (_index, name) => {
return {
name,
fn: vue.withCtx((data) => [
vue.renderSlot(_ctx.$slots, name, vue.normalizeProps(vue.guardReactiveProps(data)))
])
};
})
]), 1040, ["isClickEdit", "configEdit", "modelValue", "onUpdate:modelValue"])) : vue.createCommentVNode("v-if", true),
vue.createCommentVNode(" \u5B57\u5178\u8FC7\u6EE4 "),
item.filters && item.filters.list ? (vue.openBlock(), vue.createElementBlock(
vue.Fragment,
{ key: 4 },
[
vue.createTextVNode(
vue.toDisplayString(constantEscape(
scope.row[item.prop],
_ctx.table.listTypeInfo[item.filters.list],
item.filters.key || "value",
item.filters.label || "label"
)),
1
/* TEXT */
)
],
64
/* STABLE_FRAGMENT */
)) : vue.createCommentVNode("v-if", true),
!item.render && !item.slotName && !item.canEdit && !item.filters && !item.isClickEdit && !item.formatter ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_13, [
vue.createElementVNode(
"span",
null,
vue.toDisplayString(scope.row[item.prop]),
1
/* TEXT */
)
])) : vue.createCommentVNode("v-if", true)
]),
_: 2
/* DYNAMIC */
}, [
item.headerRequired || item.renderHeader || item.isClickEdit ? {
name: "header",
fn: vue.withCtx(() => [
item.renderHeader ? (vue.openBlock(), vue.createBlock(renderHeader_vue_vue_type_script_setup_true_lang.default, {
key: 0,
column: item,
render: item.renderHeader
}, null, 8, ["column", "render"])) : vue.createCommentVNode("v-if", true),
item.headerRequired && emptyDataRequired.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_11, [
_hoisted_12,
vue.createElementVNode(
"span",
null,
vue.toDisplayString(item.label),
1
/* TEXT */
)
])) : vue.createCommentVNode("v-if", true),
item.isClickEdit ? (vue.openBlock(), vue.createElementBlock(
"div",
{
key: 2,
class: "click_edit",
style: vue.normalizeStyle({ justifyContent: item.editIconAlign || _ctx.align || "center" })
},
[
vue.createElementVNode(
"span",
null,
vue.toDisplayString(item.label),
1
/* TEXT */
),
!item.isShowEditIcon ? (vue.openBlock(), vue.createBlock(
_component_el_icon,
vue.normalizeProps(vue.mergeProps({ key: 0 }, { size: 14, ...item.editIconBind })),
{
default: vue.withCtx(() => [
vue.createVNode(vue.unref(Icons.Edit))
]),
_: 2
/* DYNAMIC */
},
1040
/* FULL_PROPS, DYNAMIC_SLOTS */
)) : vue.createCommentVNode("v-if", true)
],
4
/* STYLE */
)) : vue.createCommentVNode("v-if", true)
]),
key: "0"
} : void 0
]), 1040, ["type", "label", "prop", "min-width", "width", "sortable", "align", "fixed", "formatter"])) : vue.createCommentVNode("v-if", true)
],
64
/* STABLE_FRAGMENT */
)) : (vue.openBlock(), vue.createElementBlock(
vue.Fragment,
{ key: 1 },
[
vue.createCommentVNode(" \u8868\u5934\u5408\u5E76\u5355\u5143\u683C "),
(vue.openBlock(), vue.createBlock(TTableColumn_vue_vue_type_script_setup_true_lang.default, vue.mergeProps({
key: index + "m",
item,
align: _ctx.align
}, _ctx.$attrs, { sortable: _ctx.sortable }), vue.createSlots({
_: 2
/* DYNAMIC */
}, [
vue.renderList(vue.unref(slots), (_index, name) => {
return {
name,
fn: vue.withCtx((data) => [
vue.renderSlot(_ctx.$slots, name, vue.normalizeProps(vue.guardReactiveProps(data)))
])
};
})
]), 1040, ["item", "align", "sortable"]))
],
2112
/* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
))
],
64
/* STABLE_FRAGMENT */
);
}),
256
/* UNKEYED_FRAGMENT */
)),
vue.renderSlot(_ctx.$slots, "default"),
vue.createVNode(operator_vue_vue_type_script_setup_true_lang.default, {
table: _ctx.table,
btnPermissions: _ctx.btnPermissions,
tableData: vue.unref(state).tableData,
align: _ctx.align
}, null, 8, ["table", "btnPermissions", "tableData", "align"])
]),
_: 2
/* DYNAMIC */
}, [
vue.renderList(vue.unref(slots), (_index, name) => {
return {
name,
fn: vue.withCtx((data) => [
vue.renderSlot(_ctx.$slots, name, vue.normalizeProps(vue.guardReactiveProps(data)))
])
};
})
]), 1040, ["data", "class", "highlight-current-row", "border"]),
vue.createCommentVNode(" \u5206\u9875\u5668 "),
vue.unref(state).tableData && vue.unref(state).tableData.length && _ctx.isShowPagination ? (vue.openBlock(), vue.createBlock(_component_el_pagination, vue.mergeProps({
key: 1,
"current-page": _ctx.table.currentPage,
"onUpdate:currentPage": _cache[4] || (_cache[4] = ($event) => _ctx.table.currentPage = $event),
onCurrentChange: handlesCurrentChange,
"page-sizes": _ctx.table.pageSizes || [10, 20, 50, 100],
"page-size": _ctx.table.pageSize,
"onUpdate:pageSize": _cache[5] || (_cache[5] = ($event) => _ctx.table.pageSize = $event),
layout: _ctx.table.layout || "total,sizes, prev, pager, next, jumper",
"prev-text": _ctx.table.prevText,
"next-text": _ctx.table.nextText,
total: _ctx.table.total || 0,
size: _ctx.table.size || "small"
}, _ctx.$attrs, { background: "" }), {
default: vue.withCtx(() => [
vue.renderSlot(_ctx.$slots, "pagination")
]),
_: 3
/* FORWARDED */
}, 16, ["current-page", "page-sizes", "page-size", "layout", "prev-text", "next-text", "total", "size"])) : vue.createCommentVNode("v-if", true),
vue.createCommentVNode(" \u8868\u683C\u5E95\u90E8\u6309\u94AE "),
_ctx.isShowFooterBtn && vue.unref(state).tableData && vue.unref(state).tableData.length > 0 ? (vue.openBlock(), vue.createElementBlock(
"footer",
{
key: 2,
class: "handle_wrap",
style: vue.normalizeStyle({ textAlign: _ctx.footerBtnAlign })
},
[
vue.renderSlot(_ctx.$slots, "footer"),
!vue.unref(slots).footer ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_14, [
vue.createVNode(_component_el_button, {
type: "primary",
onClick: save
}, {
default: vue.withCtx(() => [
vue.createTextVNode(
vue.toDisplayString(_ctx.saveBtnTxt),
1
/* TEXT */
)
]),
_: 1
/* STABLE */
})
])) : vue.createCommentVNode("v-if", true)
],
4
/* STYLE */
)) : vue.createCommentVNode("v-if", true)
], 8, _hoisted_1)), [
[_directive_loading, _ctx.tableLoading]
]);
};
}
});
exports.default = _sfc_main;