Commit 159d0a07ef532dc8d79f3d0bc3ca6f906e0bb296
1 parent
84a988a8
Exists in
master
and in
2 other branches
feat: 新增SchemaPage自定义Table插槽
Showing
1 changed file
with
33 additions
and
31 deletions
Show diff stats
packages/schema-page/index.vue
| @@ -25,36 +25,38 @@ | @@ -25,36 +25,38 @@ | ||
| 25 | </slot> | 25 | </slot> |
| 26 | </div> | 26 | </div> |
| 27 | <!-- 表格内容 --> | 27 | <!-- 表格内容 --> |
| 28 | - <div v-if="schema.table" class="z-schema-page__table"> | ||
| 29 | - <z-schema-table | ||
| 30 | - :size="_size" | ||
| 31 | - :schema="tableSchemaDefaultProps(schema.table)" | ||
| 32 | - v-model="tableData" | ||
| 33 | - v-loading="schema.loading !== false ? tableLoading : false" | ||
| 34 | - @selection-change="onTableSelectionChange" | ||
| 35 | - > | ||
| 36 | - <template #left> | ||
| 37 | - <el-table-column v-if="schema.selection !== false" type="selection" width="40" align="center"></el-table-column> | ||
| 38 | - </template> | ||
| 39 | - <template v-for="item in getSlotKeys('table-')" #[item.name]="slotScope"> | ||
| 40 | - <slot :name="item.slot" v-bind="{ ..._slotScope, ...slotScope }"></slot> | ||
| 41 | - </template> | ||
| 42 | - <slot v-if="schema.operation !== false" name="operation" v-bind="_slotScope"> | ||
| 43 | - <el-table-column v-bind="{ label: '操作', width: '90', align: 'center', ...(schema.operation || {}) }"> | ||
| 44 | - <template #default="{ row, column, $index }"> | ||
| 45 | - <div class="z-schema-page__table-operation"> | ||
| 46 | - <slot name="operation-left" v-bind="{ ..._slotScope, row, column, $index }"></slot> | ||
| 47 | - <slot name="operation-button" v-bind="{ ..._slotScope, row, column, $index }"></slot> | ||
| 48 | - <el-button type="text" icon="el-icon-edit" title="编辑" @click="openEdit(row)"></el-button> | ||
| 49 | - <el-popconfirm confirm-button-text="确定" cancel-button-text="取消" title="确定删除吗？" placement="top" @confirm="onDelete([row])"> | ||
| 50 | - <el-button slot="reference" type="text" icon="el-icon-delete" title="删除"></el-button> | ||
| 51 | - </el-popconfirm> | ||
| 52 | - <slot name="operation-right" v-bind="{ ..._slotScope, row, column, $index }"></slot> | ||
| 53 | - </div> | ||
| 54 | - </template> | ||
| 55 | - </el-table-column> | ||
| 56 | - </slot> | ||
| 57 | - </z-schema-table> | 28 | + <div v-if="schema.table || $scopedSlots.table" class="z-schema-page__table"> |
| 29 | + <slot name="table" v-bind="_slotScope"> | ||
| 30 | + <z-schema-table | ||
| 31 | + :size="_size" | ||
| 32 | + :schema="tableSchemaDefaultProps(schema.table)" | ||
| 33 | + v-model="tableData" | ||
| 34 | + v-loading="schema.loading !== false ? tableLoading : false" | ||
| 35 | + @selection-change="onTableSelectionChange" | ||
| 36 | + > | ||
| 37 | + <template #left> | ||
| 38 | + <el-table-column v-if="schema.selection !== false" type="selection" width="40" align="center"></el-table-column> | ||
| 39 | + </template> | ||
| 40 | + <template v-for="item in getSlotKeys('table-')" #[item.name]="slotScope"> | ||
| 41 | + <slot :name="item.slot" v-bind="{ ..._slotScope, ...slotScope }"></slot> | ||
| 42 | + </template> | ||
| 43 | + <slot v-if="schema.operation !== false" name="operation" v-bind="_slotScope"> | ||
| 44 | + <el-table-column v-bind="{ label: '操作', width: '90', align: 'center', ...(schema.operation || {}) }"> | ||
| 45 | + <template #default="{ row, column, $index }"> | ||
| 46 | + <div class="z-schema-page__table-operation"> | ||
| 47 | + <slot name="operation-left" v-bind="{ ..._slotScope, row, column, $index }"></slot> | ||
| 48 | + <slot name="operation-button" v-bind="{ ..._slotScope, row, column, $index }"></slot> | ||
| 49 | + <el-button type="text" icon="el-icon-edit" title="编辑" @click="openEdit(row)"></el-button> | ||
| 50 | + <el-popconfirm confirm-button-text="确定" cancel-button-text="取消" title="确定删除吗？" placement="top" @confirm="onDelete([row])"> | ||
| 51 | + <el-button slot="reference" type="text" icon="el-icon-delete" title="删除"></el-button> | ||
| 52 | + </el-popconfirm> | ||
| 53 | + <slot name="operation-right" v-bind="{ ..._slotScope, row, column, $index }"></slot> | ||
| 54 | + </div> | ||
| 55 | + </template> | ||
| 56 | + </el-table-column> | ||
| 57 | + </slot> | ||
| 58 | + </z-schema-table> | ||
| 59 | + </slot> | ||
| 58 | </div> | 60 | </div> |
| 59 | <!-- 底部区域 --> | 61 | <!-- 底部区域 --> |
| 60 | <div v-if="schema.selection !== false || schema.pagination !== false" class="z-schema-page__footer"> | 62 | <div v-if="schema.selection !== false || schema.pagination !== false" class="z-schema-page__footer"> |
| @@ -258,7 +260,7 @@ export default { | @@ -258,7 +260,7 @@ export default { | ||
| 258 | }, | 260 | }, |
| 259 | _slotScope() { | 261 | _slotScope() { |
| 260 | const properties = ['selection', 'currentPage', 'pageSizes', 'pageSize', 'layout', 'total']; | 262 | const properties = ['selection', 'currentPage', 'pageSizes', 'pageSize', 'layout', 'total']; |
| 261 | - const methods = ['search', 'onSearch', 'onDelete', 'onDeleteMultiple', 'openNew', 'openEdit', 'openDetail', 'openDialog', 'closeDialog']; | 263 | + const methods = ['search', 'onSearch', 'onDelete', 'onDeleteMultiple', 'onTableSelectionChange', 'openNew', 'openEdit', 'openDetail', 'openDialog', 'closeDialog']; |
| 262 | const defaultScope = { | 264 | const defaultScope = { |
| 263 | size: this._size, | 265 | size: this._size, |
| 264 | loading: this.tableLoading, | 266 | loading: this.tableLoading, |