This commit is contained in:
lcw
2025-09-12 18:21:03 +08:00
485 changed files with 204047 additions and 351 deletions

View File

@ -1,46 +1,22 @@
<template>
<div style="width: 100%" :class="getConfiger.showSelectType === 'radio' ? 'tabBoxRadio' : ''">
<div style="width: 100%" :class="getConfiger.showSelectType === 'radio' ? 'tabBoxRadio' : ''">
<!-- hasChildren要在tableData中定义表示当前行有没有下一级 children要在tableData中定义表示下一级的数据-->
<el-table
ref="multipleTableRef"
:data="tableData"
@selection-change="handleSelectionChange"
:row-key="getConfiger.rowKey"
:border="getConfiger.border"
:default-expand-all="getConfiger.defaultExpandAll"
:stripe="getConfiger.stripe"
:height="tableHeight"
v-loading="tableConfiger.loading"
:lazy="getConfiger.lazy"
:load="load"
:tree-props="treePros"
style="width: 100%"
:header-cell-class-name="() => 'HeadBgColor'"
<el-table ref="multipleTableRef" :data="tableData" @selection-change="handleSelectionChange"
:row-key="getConfiger.rowKey" :border="getConfiger.border" :default-expand-all="getConfiger.defaultExpandAll"
:stripe="getConfiger.stripe" :height="tableHeight" v-loading="tableConfiger.loading" :lazy="getConfiger.lazy"
:load="load" :tree-props="treePros" style="width: 100%" :header-cell-class-name="() => 'HeadBgColor'"
:highlight-current-row="getConfiger.showSelectType === 'radio'"
:row-style="{ height: getConfiger.rowHeight === 'auto' ? getConfiger.rowHeight : getConfiger.rowHeight + 'px'}"
>
<el-table-column style="width: 55px" type="selection" width="55" v-if="getConfiger.showSelectType === 'radio' ? 'tabBoxRadio' : ''" />
<el-table-column
type="index"
label="序号"
v-if="getConfiger.showIndex"
width="60"
:align="getConfiger?.align"
/>
:row-style="{ height: getConfiger.rowHeight === 'auto' ? getConfiger.rowHeight : getConfiger.rowHeight + 'px' }">
<el-table-column style="width: 55px" type="selection" width="55"
v-if="getConfiger.showSelectType === 'radio' ? 'tabBoxRadio' : ''" />
<el-table-column type="index" label="序号" v-if="getConfiger.showIndex" width="60" :align="getConfiger?.align" />
<el-table-column
v-for="(item, index) in tableColumn"
:align="getConfiger?.align"
:prop="item.prop"
:key="index"
:label="item.label"
:width="item.width"
style="width: 100%; font-size: 14px"
:show-overflow-tooltip="item.showOverflowTooltip || false"
:sortable="item.sortable || false"
>
<el-table-column v-for="(item, index) in tableColumn" :align="getConfiger?.align" :prop="item.prop" :key="index"
:label="item.label" :width="item.width" style="width: 100%; font-size: 14px"
:show-overflow-tooltip="item.showOverflowTooltip || false" :sortable="item.sortable || false">
<!-- 使用自定义 -->
<template v-if="item.showSolt" #default="scope">
<slot :name="item.prop" v-bind="scope"></slot>
</template>
<!-- 默认 -->
@ -48,14 +24,10 @@
{{ row[item.prop] }}
</template>
</el-table-column>
<!-- 操作 -->
<el-table-column
v-if="getConfiger.haveControls"
:fixed="fixed"
:label="getConfiger.controls"
:width="controlsWidth"
:align="getConfiger?.align"
>
<el-table-column v-if="getConfiger.haveControls" :fixed="fixed" :label="getConfiger.controls"
:width="controlsWidth" :align="getConfiger?.align">
<template #default="scope">
<slot name="controls" v-bind="scope"></slot>
</template>
@ -69,7 +41,7 @@ import { nextTick, onMounted, reactive, ref, watch, watchEffect } from "vue";
const props = defineProps({
tableConfiger: {
type: Object,
default: () => {}
default: () => { }
},
tableData: {
type: Array,
@ -130,12 +102,12 @@ onMounted(() => {
});
// 可选的时候选择的数据
const handleSelectionChange = (val) => {
if(getConfiger.showSelectType === 'radio' && val.length > 1){
if (getConfiger.showSelectType === 'radio' && val.length > 1) {
let del_row = val.shift();
multipleTableRef.value.toggleRowSelection(del_row, false);
currentRow.value = val;
emit("chooseData", val);
}else{
} else {
emit("chooseData", val);
}
};
@ -163,29 +135,27 @@ const load = (date, treeNode, resolve) => {
function setDefaultChoose() {
nextTick(() => {
// 多选的默认选中
if ( props.tableConfiger.defaultSelectKeys?.length > 0 && props.tableConfiger.showSelectType === "checkBox" ) {
if (props.tableConfiger.defaultSelectKeys?.length > 0 && props.tableConfiger.showSelectType === "checkBox") {
props.tableData.forEach((item) => {
if ( props.tableConfiger.defaultSelectKeys.findIndex( (v) => v === item[props.tableConfiger.rowKey] ) > -1) {
if (props.tableConfiger.defaultSelectKeys.findIndex((v) => v === item[props.tableConfiger.rowKey]) > -1) {
multipleTableRef.value.toggleRowSelection(item, true);
}
});
// 单选的默认选中
} else if ( props.tableConfiger.defaultSelectKeys && props.tableConfiger.defaultSelectKeys?.length > 0 && props.tableConfiger.showSelectType === "radio" ) {
} else if (props.tableConfiger.defaultSelectKeys && props.tableConfiger.defaultSelectKeys?.length > 0 && props.tableConfiger.showSelectType === "radio") {
getConfiger.radioChoose = props.tableConfiger.defaultSelectKeys[0];
}
});
}
</script>
<style lang = "scss">
</style>
<style lang="scss"></style>
<style>
.tabBoxRadio .el-checkbox__inner {
border-radius: 50% !important;
}
.tabBoxRadio .el-table__header-wrapper .el-checkbox {
display: none;
}
</style>