# 客服弹窗
本文档构建于2020年08月015日，组件放在goose包中,有invoiceSelect使用上的疑问请联系VinceZhang
# 功能
发票组件是一个业务方调用的弹窗组件，用于购买商品时填写相关发票信息（发票抬头、税号、类型等），支持获取微信发票抬头
注意事项
因为当时后端未添加发票api，需要业务方进行微信始化的时候传入发票api，所以把获取微信发票抬头事件放在了业务方进行数据通讯，组件尚未足够抽象，在下一个涉及发票组件的项目开发时会进行优化，轻喷
# 如何引入
请先使用cnpm config set registry=http://111.230.199.61:6888/
cnpm isntall @xiaoe/goose
import invoiceSelect from '@xiaoe/goose'
import '@xiaoe/goose/static/index.css';
1
2
3
4
2
3
4
# 使用示例
<invoice-select
v-show="showInvoice"
:wechatInvoice="wechatInvoice"
:invoiceTypeData="invoiceTypeData"
@closeInvoice="showInvoice = false"
@getWechatInvoice="getWechatInvoice"
@invoiceData="getInvoiceData"
></invoice-select>
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
// 业务方获取微信发票抬头
getWechatInvoice() {
window.wx.invoke('chooseInvoiceTitle', { scene: '1' }, function(res) {
let { title, taxNumber } = JSON.parse(res.choose_invoice_title_info);
that.wechatInvoice = {
invoice_title: title,
tax_number: taxNumber
};
});
},
1
2
3
4
5
6
7
8
9
10
2
3
4
5
6
7
8
9
10
# 事件
| event | description |
|---|---|
| closeInvoice | 关闭发票弹窗 |
| getWechatInvoice | 获取微信发票抬头 |
| invoiceData | 点击‘完成’后保存的发票数据 |
# 参数
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|---|---|---|---|---|
| wechatInvoice | 业务方调用微信api后获得的发票数据 | Object | - | invoice_titletax_number |
| invoiceTypeData | 店铺支持的发票类型 | Array | [] | 'GOODS_DETAIL''GOODS_CATEGORY' |
← toastSuccess 客服弹窗组件 →