67 lines
1.8 KiB
Vue
67 lines
1.8 KiB
Vue
<template>
|
||
<el-table-column
|
||
v-if="shouldShow"
|
||
:prop="prop"
|
||
:label="label"
|
||
v-bind="$attrs"
|
||
>
|
||
<template v-for="(_, name) in $slots" :key="name" #[name]="slotProps">
|
||
<slot :name="name" v-bind="slotProps" />
|
||
</template>
|
||
</el-table-column>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
import { computed, inject } from 'vue'
|
||
|
||
interface Props {
|
||
prop?: string
|
||
label?: string
|
||
// 其他 el-table-column 的所有属性都通过 $attrs 传递
|
||
}
|
||
|
||
const props = withDefaults(defineProps<Props>(), {
|
||
prop: '',
|
||
label: ''
|
||
})
|
||
|
||
// 从父组件注入 isColumnVisible 函数
|
||
const isColumnVisible = inject<(propOrLabel: string) => boolean>('isColumnVisible', () => true)
|
||
|
||
// 计算是否应该显示该列
|
||
const shouldShow = computed(() => {
|
||
// 优先使用 prop，如果没有 prop 则使用 label
|
||
let key = props.prop || props.label || ''
|
||
if (!key) {
|
||
// 如果没有 prop 和 label，默认显示（可能是序号列等特殊列）
|
||
return true
|
||
}
|
||
|
||
// 如果 key 是 label，尝试通过 labelToPropMap 映射到 prop
|
||
// 这样可以确保与 useTableColumns 的提取逻辑一致
|
||
if (!props.prop && props.label) {
|
||
const labelToPropMap: Record<string, string> = {
|
||
'是否退休': 'tied',
|
||
'姓名/工号': 'nameNo',
|
||
'性别': 'sex',
|
||
'部门': 'deptName',
|
||
'学历学位': 'dgreeName',
|
||
'职称等级': 'professionalTitle',
|
||
'岗位级别': 'stationLevelName',
|
||
'职业资格等级': 'levelName',
|
||
'职业资格工种': 'workName',
|
||
'用工性质': 'employmentNatureName',
|
||
'手机': 'telPhone',
|
||
'家庭住址': 'homeAddress',
|
||
'授课类型': 'teacherCate',
|
||
'操作': 'action',
|
||
}
|
||
// 如果 label 在映射表中，使用映射后的 prop；否则使用 label
|
||
key = labelToPropMap[props.label] || props.label
|
||
}
|
||
|
||
return isColumnVisible(key)
|
||
})
|
||
</script>
|
||
|