# tripg-payment

> A Vue.js swanui

Latest version **1.1.7** (published 2019-05-29) · MIT license · 0 weekly downloads

## Install

```sh
npm install tripg-payment
pnpm add tripg-payment
yarn add tripg-payment
bun add tripg-payment
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.1.7 |
| Published | 2019-05-29 |
| First published | 2019-04-22 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 6 |
| Unpacked size | 525.6 KB |
| Known vulnerabilities | 0 (+25 in 2 direct dependencies) |
| Install scripts | no |
| Author | liuyang |
| Maintainers | gxy1994 |

## Links

- npm: https://www.npmjs.com/package/tripg-payment
- npm.io page: https://npm.io/package/tripg-payment

## Dependencies (6)

- [vue](https://npm.io/package/vue.md) ^2.5.11
- [axios](https://npm.io/package/axios.md) ^0.18.0
- [mint-ui](https://npm.io/package/mint-ui.md) ^2.2.13
- [vue-i18n](https://npm.io/package/vue-i18n.md) ^8.10.0
- [mintui-toast](https://npm.io/package/mintui-toast.md) ^1.0.8
- [better-scroll](https://npm.io/package/better-scroll.md) ^1.15.1

## Recent versions

- 1.1.7 (latest) — 2019-05-29
- 1.1.6 — 2019-05-29
- 1.1.5 — 2019-05-29
- 1.1.4 — 2019-05-29
- 1.1.3 — 2019-05-29
- 1.1.2 — 2019-05-28
- 1.1.1 — 2019-05-28
- 1.0.9 — 2019-05-28
- 1.0.8 — 2019-05-28
- 1.0.7 — 2019-05-27
- 1.0.6 — 2019-05-27
- 1.0.5 — 2019-05-24
- 1.0.4 — 2019-05-24
- 1.0.2 — 2019-05-22
- 1.0.0 — 2019-04-22

## README

# swan-tripgui

> A Vue.js project

## Build Setup

``` bash
# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build
```

For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader).

### 更换组件   npm uninstall tripg-invoices  
### 发票组件


	注： 各个项目引入后 全局css样式表中mint-ui.css中修改mint-toast层级
		.mint-toast{
		  z-index: 99999 !important;
		} 
	如果收银台页面左上角返回按钮不显示，请在当前页调整样式问题
	其他样式冲突==>自行调试 
	
	
依赖安装后 在main.js中 添加

	
	import invoices from 'swan-tripgui'
	Vue.use(invoices)
	import invmask from 'swan-tripgui'
	Vue.use(invmask)
	
	支付组件
	import payment from 'swan-tripgui'
	Vue.use(payment)

	
	在index.html页面中引入支付包
	 if(window.Vue){
	   document.write('<script src="https://www.tripglobal.cn/tripg.php?_t='+Math.ceil(Math.random() * 999)+'"><\/script>');
	 }else{
	   document.write('<script src="https://www.tripglobal.cn/tripgvue.php?_t='+Math.ceil(Math.random() * 999)+'"><\/script>');
	 }
####在需要引入发票组件的页面加入
	
	支付内容展示页面
	<payment 
		:payParams="payParams" 
		:payUserInfo='payUserInfo' 
		:payOrderStatus="payOrderStatus"  
		@cancelOrder="cancelOrderBtn"  
		@successOrder="successOrder"></payment>

	发票内容展示页面
	<invoices  
      ref="invoices"
      :invoicesObj.sync = "invoicesObj"
      :checkinvoicesIndex.sync = "checkinvoicesIndex"
      :checkinvoicesflag.sync = 'checkinvoicesflag'
      :ajaxObj = "ajaxObj"
      :travelType='isYg'
      ></invoices>
      

	发票弹框展示页面
	 <invmask 
      ref="inmask"
      :invoicesObj.sync = "invoicesObj"
      :checkinvoicesIndex.sync = "checkinvoicesIndex"
      :checkinvoicesflag.sync = 'checkinvoicesflag'
      :ajaxObj = "ajaxObj"
      ></invmask>
      
      
 	data里加入
  	  userInfo:{},//开局发票人员信息（登陆信息）
	  ajaxObj:null, //发票请求ajax参数
	  invoicesObj:{},//发票信息
	  checkinvoicesIndex:null,//点击发票内容组件的项
	  checkinvoicesflag:null, 
	  isYg:null,  //true or false 因公因私 传Boolean类型
	data里加入支付组件所需
		payUserInfo:{},   //个人信息字符串
		payParams:{
			orderid: "",   //订单号
			callBackUrls: encodeURI(window.location.href),   //回调地址
			travelType:1,  //因公因私  1因公  2因私
			testPay:false,  //测试环境  true or false
			payId:'14',   //产品线id 机票11 酒店12 租车13 火车票14 国际机票28 具体与产品线一致
			exceed:false   //酒店超标支付
		},
		payOrderStatus:'20190524093020',   //20190524093020 保险订单创建时间
	
	created() {
	    this.userInfo = JSON.parse(localStorage.getItem('userInfo'))
	    this.ajaxObj = {
	      userInfo: this.userInfo,
	      product_id: '11' //产品线id 机票11 酒店12 租车13 火车票14 国际机票28 具体与产品线一致
	    }
	  },
	methods:{
		<!-- 按需调用 -->
		cancelOrderBtn(){
			<!-- 取消订单返回事件 -->
		},
		successOrder(item){
			<!-- 授信支付成功返回事件 -->
			console.log(item,'订单号')
		}
		}
	
	
	  
 
 	
 	
 	
###(提交发票。提交发票走原tripg发票的逻辑)

	在计算属性 computed中获取
   	this.$refs.invoices.$data.popVisible;//该值是判断发票开关是否打开（下单时判断）

###下单按钮事件中添加
 	// 验证发票信息是否完整
 	
	if (this.$refs.invoices.checkInvoice() == false) {
	  return;
	}
	
###下单成功后添加
	
	this.allinvoiceInfo = []; //所有发票信息
	["下单成功后返回的订单号"].forEach(v => {
	  //这里是给李发的值,具体添加什么李发提供 businessinfo，
	  //下面是机票线的，其它线修改一下。
	  v.businessinfo = {
	    product_id: v.product_id, //产品线ID
	    order_no: v.tradeCode, //订单号
	    ...this.paramsObj[0], //其它航班信息等
	    money: v.pay_money //价格
	  };
	  this.allinvoiceInfo.push(v);
	});
	
	//下单后记录综合订单号。
	this.mainOrderCode = order_info.Result.mainOrderCode;

###	最后一步提交，添加在订单成功后，跳路由之前。
 	
 	await this.$refs.invoices.invoiceInfo_post(
      allinvoiceInfo,
      mainOrderCode
    );

---
_Source: https://npm.io/package/tripg-payment · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._