feat: 优化矩阵显示

- 解决打开矩阵的时候字体太长会自动换行的问题
- title 和 下面的选项对齐
This commit is contained in:
Huangzhe
2025-03-20 13:16:26 +08:00
parent 131a0c11f8
commit 7b4832ee3e
3 changed files with 36 additions and 24 deletions

View File

@@ -3,18 +3,22 @@
<el-table-column width="140"> <el-table-column width="140">
<template #header></template> <template #header></template>
<template #default="{ row /*, column, $index*/ }"> <template #default="{ row /*, column, $index*/ }">
<contenteditable v-model="row.option" :active="active" @blur="emitValue" /> <el-text truncated>
<contenteditable v-model="row.option" :active="active" @blur="emitValue" />
</el-text>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column v-for="(col, colIndex) in cols" :key="col.option" width="100"> <el-table-column v-for="(col, colIndex) in cols" :key="col.option" width="100">
<template #header> <template #header>
<contenteditable <el-text truncated>
v-if="col.option" <contenteditable
v-model="col.option" v-if="col.option"
:active="active" v-model="col.option"
@blur="emitValue" :active="active"
/> @blur="emitValue"
<van-field v-else v-model="col.option" placeholder="请输入"></van-field> />
<van-field v-else v-model="col.option" placeholder="请输入"></van-field>
</el-text>
</template> </template>
<template #default="{ /*row, column, */ $index: rowIndex }"> <template #default="{ /*row, column, */ $index: rowIndex }">
<input <input

View File

@@ -3,18 +3,22 @@
<el-table-column width="80"> <el-table-column width="80">
<template #header></template> <template #header></template>
<template #default="{ row /*, column, $index*/ }"> <template #default="{ row /*, column, $index*/ }">
<contenteditable v-model="row.option" :active="active" @blur="emitValue" /> <el-text truncated>
<contenteditable v-model="row.option" :active="active" @blur="emitValue" />
</el-text>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column v-for="(col, colIndex) in cols" :key="col.option" width="100"> <el-table-column v-for="(col, colIndex) in cols" :key="col.option" width="100">
<template #header> <template #header>
<contenteditable <el-text truncated>
v-if="col.option" <contenteditable
v-model="col.option" v-if="col.option"
:active="active" v-model="col.option"
@blur="emitValue" :active="active"
/> @blur="emitValue"
<van-field v-else v-model="col.option" placeholder="请输入"></van-field> />
<van-field v-else v-model="col.option" placeholder="请输入"></van-field>
</el-text>
</template> </template>
<template #default="{ /*row, column, */ $index: rowIndex }"> <template #default="{ /*row, column, */ $index: rowIndex }">
<input <input

View File

@@ -3,18 +3,22 @@
<el-table-column width="140"> <el-table-column width="140">
<template #header></template> <template #header></template>
<template #default="{ row /*, column, $index*/ }"> <template #default="{ row /*, column, $index*/ }">
<contenteditable v-model="row.option" :active="active" @blur="emitValue" /> <el-text truncated>
<contenteditable v-model="row.option" :active="active" @blur="emitValue" />
</el-text>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column v-for="(col, colIndex) in cols" :key="col.option" width="100"> <el-table-column v-for="(col, colIndex) in cols" :key="col.option" width="100">
<template #header> <template #header>
<contenteditable <el-text truncated>
v-if="col.option" <contenteditable
v-model="col.option" v-if="col.option"
:active="active" v-model="col.option"
@blur="emitValue" :active="active"
/> @blur="emitValue"
<van-field v-else v-model="col.option" placeholder="请输入"></van-field> />
<van-field v-else v-model="col.option" placeholder="请输入"></van-field>
</el-text>
</template> </template>
<template #default="{ /*row, column, */ $index: rowIndex }"> <template #default="{ /*row, column, */ $index: rowIndex }">
<input <input