4 changed files with 136 additions and 49 deletions
-
52src/components/SmartTable.vue
-
9src/views/modules/production/bagLabels.vue
-
1src/views/modules/production/bagLabelsTCP.vue
-
49src/views/modules/production/liuhuaProductView.vue
@ -0,0 +1,52 @@ |
|||
<template> |
|||
<el-table v-bind="$attrs" v-on="$listeners"> |
|||
<!-- 默认插槽用于自定义的一些参数 --> |
|||
<slot></slot> |
|||
<el-table-column |
|||
v-for="(col, index) in columns" |
|||
:key="index" |
|||
v-bind="col" |
|||
> |
|||
<template slot-scope="{ row, $index }"> |
|||
<!-- 优先使用插槽 --> |
|||
<slot |
|||
v-if="col.slot" |
|||
:name="col.prop" |
|||
:row="row" |
|||
:index="$index" |
|||
></slot> |
|||
|
|||
<!-- 渲染函数处理 --> |
|||
<template v-else-if="col.formatter"> |
|||
<render-cell :render="col.formatter" :row="row" :index="$index" /> |
|||
</template> |
|||
|
|||
<!-- 默认显示 --> |
|||
<span v-else>{{ row[col.prop] }}</span> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
</template> |
|||
|
|||
<script> |
|||
// 函数式组件处理渲染函数 |
|||
const RenderCell = { |
|||
functional: true, |
|||
props: { |
|||
render: Function, |
|||
row: Object, |
|||
index: Number |
|||
}, |
|||
render(h, ctx) { |
|||
return ctx.props.render(h, ctx.props.row, ctx.props.index) |
|||
} |
|||
} |
|||
|
|||
export default { |
|||
name: 'SmartTable', |
|||
components: { RenderCell }, |
|||
props: { |
|||
columns: { type: Array, required: true } |
|||
} |
|||
} |
|||
</script> |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue