// component preview
<template>
<table border="1" width="99%" style="border-bottom:0;" cellspacing="0">
<tr>
<slot name="tableHeader" />
</tr>
<slot name="tableContent" />
<tr>
<slot name="tableFooter" />
</tr>
</table>
</template>
<script>
export default {
name: 'Preview',
props: {},
data () {
return {
}
}
}
</script>
<style scoped>
</style>
// 在父组件中引入preview import preview from 'preview'
<preview>
<template slot="tableHeader">
<th v-for="(item,index) in stockInLabelList" :key="index">
{{ item }}
</th>
</template>
<template slot="tableContent">
<tr v-for="(item,index) in detailsData" :key="index">
<td>
{{ index + 1 }}
</td>
<td>
{{ item.id }}
</td>
<td>
{{ item.productname }}
</td>
<td>
{{ item.attribute }}
</td>
<td>
{{ item.barcode || '-' }}
</td>
<td>
{{ item.nit }}
</td>
<td>
{{ getInProductCount(item) }}
</td>
<td>
{{ item.give }}{{ item.unit }}
</td>
<td>
{{ item.count }}{{ item.unit }}
</td>
<td>
{{ item.price / 100 }}
</td>
<td>
{{ item.inprice / 1000 }}
</td>
<td>
{{ (item.count - item.give) * item.inprice / 1000 }}
</td>
<td>
{{ (item.netReceipts / (item.count - item.give) / 100).toFixed(3) }}
</td>
<td>
{{ item.netReceipts / 100 }}
</td>
</tr>
</template>
</preview>
有关打印预览时原生表格table的使用
最新推荐文章于 2024-08-23 13:45:37 发布