VxBillTable 电子票据单据

引入

import VxBillTable from '@/components/vx-bill-table';

// 页面内局部引入
export default {
  components: {
    [VxBillTable.name]: VxBillTable,
  },
};
// 全局引入
Vue.component(VxBillTable.name, VxBillTable);

使用指南

<!-- 展示票据详情时传票据号 -->
<vx-bill-table :bill-no="billNo"></vx-bill-table>

<!-- 制单页面展示票据详情，需传整个制单数据给组件 -->
<vx-bill-table :bill-data="billData"></vx-bill-table>

API

VxBillTable Props

属性	说明	类型	默认值	备注
`billNo`	电子票据票据单号	`String`	-	-
`titleBtn`	是否显示顶部切换正反面按钮	`Boolean`	`true`	-
`billData`	票据出票制单数据	`Object`	`{}`	-

不需要顶部切换正反面按钮，在自己的页面底部有切换正反面按钮的情况

<vx-bill-table 
  :bill-no="billNo" 
  :title-btn="false" 
  ref="billTable">
</vx-bill-table> 
<ui-button @click="onSwitch()">{{ msg }}</ui-button>

data(){
  return {
    msg:'票据背面'
  }
}
methods:{
  onSwitch() {
    this.$refs.billTable.isShowBack = !this.$refs.billTable.isShowBack;
    this.msg = this.$refs.billTable.isShowBack ? '票据背面' : '票据正面';
  },
}

Current Tags

0.0.5 ... latest (3 years ago)

1 Versions

0.0.5 ... 3 years ago