feat(CuteTransfer): 优化数据穿梭组件功能
- 将组件内按钮尺寸从 mini 调整为 small - 添加表格选择控制方法 onTableSelectionRender - 实现禁用状态数据项的选择限制 - 在演示页面更新组件标题文案 - 移除段落标题中的 mini 按钮尺寸设置 - 为演示数据添加禁用状态测试样例
This commit is contained in:
@@ -10,7 +10,7 @@
|
||||
<el-col :span="11">
|
||||
<el-input
|
||||
v-model="searchValue"
|
||||
size="mini"
|
||||
size="small"
|
||||
placeholder="输入关键字搜索"
|
||||
style="width: 100%;"
|
||||
@input="onSearchValueChange"
|
||||
@@ -31,7 +31,7 @@
|
||||
highlight-selection-row
|
||||
@selection-change="onLeftTableSelectionChange"
|
||||
>
|
||||
<el-table-column type="selection" width="55" />
|
||||
<el-table-column type="selection" width="55" :selectable="onTableSelectionRender" />
|
||||
<slot />
|
||||
</el-table>
|
||||
<el-col :span="24" class="selection-box">
|
||||
@@ -43,7 +43,7 @@
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-d-arrow-right"
|
||||
size="mini"
|
||||
size="small"
|
||||
:disabled="leftSelection.length === 0"
|
||||
@click="onTransferRight"
|
||||
/>
|
||||
@@ -52,7 +52,7 @@
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-d-arrow-left"
|
||||
size="mini"
|
||||
size="small"
|
||||
:disabled="rightSelection.length === 0"
|
||||
@click="onTransferLeft"
|
||||
/>
|
||||
@@ -74,7 +74,7 @@
|
||||
highlight-selection-row
|
||||
@selection-change="onRightTableSelectionChange"
|
||||
>
|
||||
<el-table-column type="selection" width="55" />
|
||||
<el-table-column type="selection" width="55" :selectable="onTableSelectionRender" />
|
||||
<slot />
|
||||
</el-table>
|
||||
<el-col :span="24" class="selection-box">
|
||||
@@ -176,6 +176,9 @@ export default {
|
||||
this.searchCacheDS = []
|
||||
}
|
||||
},
|
||||
onTableSelectionRender(row, index) {
|
||||
return !(row.disabled && row.disabled === true)
|
||||
},
|
||||
onLeftTableSelectionChange(selection) {
|
||||
this.leftSelection = selection
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user