Files
root 99c139d6ce fix: Vue2 到 Vue3 迁移兼容修复
- 修复 uni-popup-dialog/uni-data-picker keypress.js 中 $once 在 H5 端报错(改用生命周期钩子清理监听)
- main.js 补 $delete globalProperties polyfill(z-paging 自动高度逻辑依赖)
- App.vue onLaunch 补设备信息初始化,修复 X-Device-Id 恒为 unknown
- 68 处 ::v-deep、/deep/ 旧深度选择器替换为 :deep()(含 login-page.scss)
- zetank-personalpage 组件 .sync 修饰符改为 v-model:xxx(Vue3 已移除 .sync)
- vite.config.js HBuilderX 路径支持 HBUILDERX_HOME 环境变量覆盖
- 根 package.json 清理 image-grid 插件遗留元数据
- 收录此前未提交的 uView Vue3 兜底补丁(common/uview-init.js 及各组件 props.js)
2026-09-06 19:36:36 +08:00

138 lines
2.7 KiB
Vue

<template>
<!-- #ifdef H5 -->
<thead class="uni-table-thead">
<tr class="uni-table-tr">
<th :rowspan="rowspan" colspan="1" class="checkbox" :class="{ 'tr-table--border': border }">
<table-checkbox :indeterminate="indeterminate" :checked="checked"
@checkboxSelected="checkboxSelected"></table-checkbox>
</th>
</tr>
<slot></slot>
</thead>
<!-- #endif -->
<!-- #ifndef H5 -->
<view class="uni-table-thead">
<slot></slot>
</view>
<!-- #endif -->
</template>
<script>
import tableCheckbox from '../uni-tr/table-checkbox.vue'
export default {
name: 'uniThead',
components: {
tableCheckbox
},
options: {
// #ifdef MP-TOUTIAO
virtualHost: false,
// #endif
// #ifndef MP-TOUTIAO
virtualHost: true
// #endif
},
data() {
return {
border: false,
selection: false,
rowspan: 1,
indeterminate: false,
checked: false
}
},
created() {
this.root = this.getTable()
// #ifdef H5
this.root.theadChildren = this
// #endif
this.border = this.root.border
this.selection = this.root.type
},
methods: {
init(self) {
this.rowspan++
},
checkboxSelected(e) {
this.indeterminate = false
const backIndexData = this.root.backIndexData
const data = this.root.trChildren.filter(v => !v.disabled && v.keyValue)
if (backIndexData.length === data.length) {
this.checked = false
this.root.clearSelection()
} else {
this.checked = true
this.root.selectionAll()
}
},
/**
* 获取父元素实例
*/
getTable(name = 'uniTable') {
let parent = this.$parent
let parentName = parent.$options.name
while (parentName !== name) {
parent = parent.$parent
if (!parent) return false
parentName = parent.$options.name
}
return parent
}
}
}
</script>
<style lang="scss">
$border-color: #ebeef5;
.uni-table-thead {
display: table-header-group;
}
.uni-table-tr {
/* #ifndef APP-NVUE */
display: table-row;
transition: all 0.3s;
box-sizing: border-box;
/* #endif */
border: 1px red solid;
background-color: #fafafa;
}
.checkbox {
padding: 0 8px;
width: 26px;
padding-left: 12px;
/* #ifndef APP-NVUE */
display: table-cell;
vertical-align: middle;
/* #endif */
color: #333;
font-weight: 500;
border-bottom: 1px $border-color solid;
font-size: 14px;
// text-align: center;
}
.tr-table--border {
border-right: 1px $border-color solid;
}
/* #ifndef APP-NVUE */
.uni-table-tr {
:deep(.uni-table-th) {
&.table--border:last-child {
// border-right: none;
}
}
:deep(.uni-table-td) {
&.table--border:last-child {
// border-right: none;
}
}
}
/* #endif */
</style>