asp-smart-ui-plus-test
Version:
A Component Library for Vue 3
301 lines (296 loc) • 11.5 kB
JavaScript
;
Object.defineProperty(exports, '__esModule', { value: true });
var vue = require('vue');
var common = require('../../../../../utils/common.js');
var tableColumn = require('./table-column.js');
var tableColumnParent = require('./table-column-parent.js');
var pluginVue_exportHelper = require('../../../../../_virtual/plugin-vue_export-helper.js');
const _hoisted_1 = {
class: "asp-table-list",
style: { "width": "100%" }
};
const _sfc_main = vue.defineComponent({
__name: "table-list",
props: {
attributes: {
type: Object,
default: () => ({})
},
events: {
type: Object,
default: () => ({})
},
options: {
type: Object,
default: () => ({})
},
columns: {
type: Array,
default: () => []
},
operation: {
type: Object,
default: () => ({})
},
tableData: {
type: Array,
default: () => []
},
tableDataTemp: {
type: Array,
default: () => []
},
timeStamp: {
type: [String, Number],
default: ""
}
},
emits: [
"sortChange",
"filterChange",
"filterConfirm",
"filterReset"
],
setup(__props, { emit }) {
const props = __props;
const tData = vue.ref({
tableData: props.tableData
});
const tableSingleSelection = vue.ref();
vue.watch(
() => props.tableData,
(val) => {
tData.value.tableData = val;
},
{
deep: true
}
);
const initTable = () => {
if (props.columns.length > 0) {
const allWidth = props.columns.every((item) => {
return item.width && item.width.length > 0;
});
if (allWidth) {
props.columns[props.columns.length - 1].width = "";
}
}
};
vue.onMounted(initTable);
const handleCommand = (btn, row, index) => {
if (!btn.func) {
return;
}
btn.func(row, index, common.aspDeepClone(props.tableDataTemp));
};
const handleLabel = (btn, row) => {
if (typeof btn.label === "function") {
return btn.label(row);
}
return btn.label;
};
const handleSelectionChange = (val) => {
if (!props.options.selectionChange) {
return;
}
props.options.selectionChange(val);
};
const handleSingleChange = (val) => {
if (!props.options.singleChange) {
return;
}
props.options.singleChange(val);
};
const rowDblClick = (row) => {
if (!props.options.rowDblClick) {
return;
}
props.options.rowDblClick(row);
};
const operationDisabled = (btn, row) => {
if (typeof btn.disabled === "function") {
return btn.disabled(row);
}
return !!btn.disabled;
};
const operationShow = (btn, row) => {
if (!btn.show) {
return true;
}
if (typeof btn.show === "function") {
return btn.show(row);
}
return btn.show;
};
const columnShow = (column) => {
if (typeof column.show === "function") {
return column.show(column);
}
return column.show === void 0 ? true : column.show;
};
const sortChange = ({
prop,
order
}) => {
emit("sortChange", { prop, order });
};
const handleSingleSelection = () => {
if (!props.options.singleSelection) {
return;
}
props.options.singleSelection(
tData.value.tableData[tableSingleSelection.value]
);
};
const filterChange = (params) => {
emit("filterChange", params);
};
const filterConfirm = () => {
emit("filterConfirm");
};
const filterReset = () => {
emit("filterReset");
};
return (_ctx, _cache) => {
const _component_asp_table_column = vue.resolveComponent("asp-table-column");
const _component_asp_radio = vue.resolveComponent("asp-radio");
const _component_asp_button = vue.resolveComponent("asp-button");
const _component_asp_tooltip = vue.resolveComponent("asp-tooltip");
const _component_asp_table = vue.resolveComponent("asp-table");
return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
vue.createVNode(_component_asp_table, vue.mergeProps({ ref: "table" }, __props.attributes, {
class: "asp-table",
"highlight-current-row": __props.options["highlight-current-row"],
height: "100%",
data: tData.value.tableData,
"span-method": __props.options.spanMethod,
"default-sort": __props.options.defaultSort ? { prop: __props.options.defaultSort.prop, order: __props.options.defaultSort.order } : {},
style: { "width": "100%" }
}, vue.toHandlers(__props.events), {
onSortChange: sortChange,
onRowDblclick: rowDblClick,
onCurrentChange: handleSingleChange,
onSelectionChange: handleSelectionChange
}), {
default: vue.withCtx(() => [
__props.options.expand ? (vue.openBlock(), vue.createBlock(_component_asp_table_column, {
key: 0,
type: "expand"
}, {
default: vue.withCtx((scope) => [
vue.renderSlot(_ctx.$slots, "expand", { data: scope })
]),
_: 3
})) : vue.createCommentVNode("v-if", true),
__props.options.type === "selection" ? (vue.openBlock(), vue.createBlock(_component_asp_table_column, {
key: 1,
type: "selection",
fixed: "left",
"class-name": "table_selection",
width: "40"
})) : vue.createCommentVNode("v-if", true),
__props.options.type === "index" ? (vue.openBlock(), vue.createBlock(_component_asp_table_column, {
key: 2,
prop: "index",
fixed: "left",
"class-name": "table_index",
label: "\u5E8F\u53F7",
width: "55"
})) : vue.createCommentVNode("v-if", true),
__props.options.type === "radio" ? (vue.openBlock(), vue.createBlock(_component_asp_table_column, {
key: 3,
fixed: "left",
width: "36"
}, {
default: vue.withCtx((scope) => [
vue.createVNode(_component_asp_radio, {
modelValue: tableSingleSelection.value,
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => tableSingleSelection.value = $event),
class: "table-single-selection",
label: scope.$index,
onChange: handleSingleSelection
}, null, 8, ["modelValue", "label"])
]),
_: 1
})) : vue.createCommentVNode("v-if", true),
(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.columns, (col, i) => {
return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
columnShow(col) ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
col.isParent ? (vue.openBlock(), vue.createBlock(tableColumnParent["default"], {
key: i,
col
}, null, 8, ["col"])) : (vue.openBlock(), vue.createBlock(tableColumn["default"], {
key: "child-" + i,
col,
onFilterChange: filterChange,
onFilterConfirm: filterConfirm,
onFilterReset: filterReset
}, {
[`${col.key}`]: vue.withCtx((scope) => [
col.type === "slot" ? vue.renderSlot(_ctx.$slots, col.key, vue.normalizeProps(vue.mergeProps({ key: 0 }, scope))) : vue.createCommentVNode("v-if", true),
vue.createCommentVNode(" \u63D2\u69FD\u5185\u5BB9 ")
]),
_: 2
}, 1032, ["col"]))
], 64)) : vue.createCommentVNode("v-if", true)
], 64);
}), 256)),
Object.keys(__props.operation).length > 0 && __props.operation.options.length > 0 && (__props.operation.show || __props.operation.show === void 0) ? (vue.openBlock(), vue.createBlock(_component_asp_table_column, {
key: 4,
"header-align": "left",
fixed: __props.operation.fixed,
label: __props.operation.label,
width: __props.operation.width
}, {
default: vue.withCtx((scope) => [
(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.operation.options, (btn, i) => {
return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
btn.type === "button" || btn.type === void 0 ? vue.withDirectives((vue.openBlock(), vue.createBlock(_component_asp_button, {
key: btn.label + i + "button",
class: "table-btn",
icon: btn.icon,
size: btn.size || "mini",
type: btn.btnType || "primary",
disabled: operationDisabled(btn, scope.row),
onClick: vue.withModifiers(($event) => handleCommand(btn, scope.row, scope.$index), ["stop"])
}, {
default: vue.withCtx(() => [
vue.createTextVNode(vue.toDisplayString(handleLabel(btn, scope.row)), 1)
]),
_: 2
}, 1032, ["icon", "size", "type", "disabled", "onClick"])), [
[vue.vShow, operationShow(btn, scope.row)]
]) : btn.type === "icon" ? vue.withDirectives((vue.openBlock(), vue.createBlock(_component_asp_tooltip, {
key: btn.label + i + "icon",
class: "item",
effect: "dark",
content: handleLabel(btn, scope.row),
placement: "top-start"
}, {
default: vue.withCtx(() => [
vue.createVNode(_component_asp_button, {
class: vue.normalizeClass(["operation-icon", btn.icon]),
type: "text",
size: "mini",
disabled: operationDisabled(btn, scope.row),
onClick: vue.withModifiers(($event) => handleCommand(btn, scope.row, scope.$index), ["stop"])
}, null, 8, ["class", "disabled", "onClick"])
]),
_: 2
}, 1032, ["content"])), [
[vue.vShow, operationShow(btn, scope.row)]
]) : vue.createCommentVNode("v-if", true)
], 64);
}), 256))
]),
_: 1
}, 8, ["fixed", "label", "width"])) : vue.createCommentVNode("v-if", true)
]),
_: 3
}, 16, ["highlight-current-row", "data", "span-method", "default-sort"])
]);
};
}
});
var TableList = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["__file", "E:\\code\\SmartUIPlus\\asp-packages\\components\\pc\\advanced\\table-list\\src\\table-list.vue"]]);
exports["default"] = TableList;