Skip to content

G
group-buy-ui
Commit b49f9b15 authored by beisir's avatar beisir
Browse files
Options

Merge branch 'feat/group-buy' of git.quantgroup.cn:ui/group-buy-ui into feat/group-buy

parents 5ae75da5 3a02a582
Hide whitespace changes
Inline Side-by-side
Showing with 173 additions and 183 deletions
src/components/swipeCustomerInfo.vue
View file @ b49f9b15
......@@ -23,7 +23,7 @@ export default {
},
name: {
type: String,
default: '易烊千玺'
default: ''
},
color: {
type: String,
......
src/service/pay.service.js
View file @ b49f9b15
......@@ -108,7 +108,9 @@ function payByALIH5(info) {
*/
function payByThirdPartyCashier(info) {
if (!info.url) return;
const orderNo = cookies.get('orderNo')?.orderNo;
info.params.third = 1;
info.params.orderNo = orderNo;
const currentPath = encodeURIComponent(
window.location.origin +
'/payWaiting' +
......
src/views/goodsDetail/smallPic.less
View file @ b49f9b15
......@@ -112,6 +112,13 @@
margin-right: @padding-x;
flex-shrink: 0;
position: relative;
&-img-box{
width: 100%;
height: 100%;
/deep/ img {
border-radius: 6px;
}
}
}
&-desc{
flex: 1;
......
src/views/goodsDetail/smallPic.vue
View file @ b49f9b15
......@@ -16,7 +16,12 @@
class="goods-product-info-tag"
>{{ detailInfo.groupBuyInfo.groupBuyLimitUserCount }}人团</span
>
<cr-image width="108px" :src="detailInfo.thumbImageUrl" />
<cr-image
class="goods-product-info-img-img-box"
width=""
height=""
:src="detailInfo.thumbImageUrl"
/>
</div>
<div class="goods-product-info-desc">
<div class="goods-product-info-desc-part1">
......
src/views/pay/STATIC_DATA.js
View file @ b49f9b15
......@@ -36,10 +36,9 @@ const WECHAT_PAY = 2;
const ALIPAY_PAY = 3;
const CREDIT_AND_WECHAT_PAY = 4;
const CREDIT_AND_ALIPAY_PAY = 5;
const CASH_PAY = 6;
// 三方支付
const IS_THIRD_PAY = method => [WECHAT_PAY, ALIPAY_PAY, CASH_PAY].indexOf(method) > -1;
const IS_THIRD_PAY = method => [WECHAT_PAY, ALIPAY_PAY].indexOf(method) > -1;
//组合支付
const IS_GROUP_PAY = method => [CREDIT_AND_WECHAT_PAY, CREDIT_AND_ALIPAY_PAY].indexOf(method) > -1;
//信用支付
......@@ -53,8 +52,6 @@ const FACE_VERIFICATION_CODE_PAY = 4; //人脸验证
const PAY_SUCCESS = 3; // 支付成功
const PAY_PAYING = 2; //支付中
const CASH_PAY_SUCCESS = 1; // 现金券支付成功
function isDetentionFn() {
// 推荐开通享花卡
if (this.creditPayInfo.accountStatus !== ACCOUNT_APPLY_SUCCESS) {
......@@ -136,10 +133,19 @@ function filterAllPayList(type, data) {
}
return data;
}
const payTypeMap = {
'1': '信用支付',
'2': '微信支付',
'3': '支付宝支付',
'4': '信用支付_微信支付',
'5': '信用支付_支付宝支付',
'6': '虚拟支付0元付'
};
export {
status,
codeArr,
CASH_PAY,
payTypeE,
payStatus,
PAY_PAYING,
......@@ -157,7 +163,6 @@ export {
filterAllPayList,
ACCOUNT_NO_APPLY,
PAYMENT_CODE_PAY,
CASH_PAY_SUCCESS,
ACCOUNT_APPLY_FAIL,
creditPayStatusType,
CREDIT_AND_WECHAT_PAY,
......@@ -166,5 +171,6 @@ export {
ACCOUNT_APPLY_AUDITING,
ACCOUNT_APPLY_AUDIT_FAIL,
SMS_VERIFICATION_CODE_PAY,
FACE_VERIFICATION_CODE_PAY
FACE_VERIFICATION_CODE_PAY,
payTypeMap
};
src/views/pay/components/CouponCard.vue
View file @ b49f9b15
<template>
<div class="coupon">
<p class="coupon-face">
<span class="coupon-amount">{{ value.faceValue }}</span>
<span class="coupon-name">{{ value.name }}</span>
</p>
<p class="coupon-content">
<span class="coupon-desc">{{ value.description }}</span>
<span class="coupon-time">{{ value.couponValidTime }}</span>
</p>
<p class="coupon-action">
<cr-button size="mini" type="primary" shape="circle" class="coupon-button" @click="goNavUrl"
>去使用</cr-button
>
</p>
<div class="pay-type-list">
<p class="type-title">{{ value.title }}</p>
<payGroupItem
v-if="value.isGroupPay"
v-model="payList"
:pay-type="payType"
:disabled="disabled"
:coupon-info="couponInfo"
:show-coupon="showCoupon"
:coupon-disabled="showCoupon && !payCouponCouldBeUsed"
/>
<template v-else>
<template v-for="(item, key) of payList">
<payCardItem
v-if="item.show"
:key="key"
:pay-type="payType"
:value="item"
:disabled="disabled"
:coupon-info="couponInfo"
:show-coupon="showCoupon"
:coupon-disabled="showCoupon && !payCouponCouldBeUsed"
/>
</template>
</template>
</div>
</template>
<script>
import payCardItem from './PayCardItem';
import payGroupItem from './PayGroupCard.vue';
export default {
name: 'PayCard',
components: {
payCardItem,
payGroupItem
},
provide() {
return {
payCard: this
};
},
props: {
value: Object
value: Object,
payType: Number,
payText: String,
disabled: Boolean,
couponInfo: Object,
riskLimit: Boolean,
showCoupon: Boolean,
payCouponCouldBeUsed: Boolean,
single: { type: Boolean, default: false },
creditPay: { type: Boolean, default: false }
},
methods: {
goNavUrl() {
this.$emit('click');
}
}
data() {
return {
payList: this?.value?.payList || {}
};
},
mounted() {},
methods: {}
};
</script>
<style lang="less" scoped>
.coupon {
width: 327px;
height: 97px;
background-size: 100%;
background-image: url('../../../assets/images/pay/couponCard.png');
margin-right: @padding-sm;
padding: @padding-unit;
box-sizing: border-box;
&-face {
width: 90px;
color: @red-light;
display: inline-flex;
flex-direction: column;
align-items: center;
justify-content: center;
span {
display: block;
}
}
&-amount {
.text-30;
width: 100%;
display: flex;
flex-wrap: wrap;
word-break: break-all;
text-align: center;
font-family: PingFangSC-Medium;
&::before {
content: '¥';
.text-12;
}
}
&-name {
.text-12;
}
&-content {
width: 137px;
display: inline-flex;
flex-direction: column;
align-items: center;
justify-content: center;
span {
display: inline-block;
width: 100%;
}
}
&-desc {
.text-14;
color: @black;
overflow: hidden;
<style lang="less">
.pay-type-list {
background-color: #fff;
border-radius: @border-radius-sm;
margin-top: @padding-sm;
.type-title {
height: 48px;
.text-16;
font-weight: bold;
display: -webkit-box !important;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;
}
&-time {
.text-12;
display: flex;
color: @gray-5;
word-break: break-all;
align-items: flex-start;
}
&-action {
width: 90px;
display: inline-flex;
align-items: center;
justify-content: center;
text-align: center;
}
&-button {
width: 64px;
padding-left: @padding-md;
position: relative;
line-height: 48px;
}
}
</style>
src/views/pay/components/PayCardItem.vue
View file @ b49f9b15
......@@ -20,10 +20,10 @@
<p>{{ value.accountStatusDesc }}</p>
</div>
</div>
<div v-if="showCoupon && value.payType === 1 && !value.riskLimitDesc" class="coupon">
<div v-if="showCoupon && value.payType === 1" class="coupon">
<p class="couponDes" :class="{ disable: couponDisabled }" @click.stop="openCouponModal">
<span v-if="couponInfo.pickupId">
{{ `满${couponInfo.limitAmount}减${couponInfo.faceValue}元` }}
{{ `满${couponInfo.limitAmountNew}减${couponInfo.faceValueNew}元` }}
</span>
<span v-else>
未选择优惠券
......
src/views/pay/components/PayGroupCard.vue
View file @ b49f9b15
......@@ -14,7 +14,7 @@
<div class="dashed">
<p class="dashed-line" />
<cr-image
src="../../../assets/images/pay/addicon.png"
src="@/assets/images/pay/addicon.png"
width="24px"
height="24px"
class="dashed-icon"
......
src/views/pay/components/SmsModal.vue
View file @ b49f9b15
......@@ -83,8 +83,9 @@ export default {
}
},
getPhone() {
const phone = localStorage.get('userInfo')?.phoneNumber;
return phone;
const phone = localStorage.get('phoneNo');
const phoneS = `${phone}`.replace(/(\d{3})\d*(\d{4})/, '+86 $1 **** $2');
return phoneS;
},
clearTimer() {
clearInterval(this.timer);
......
src/views/pay/index.vue
View file @ b49f9b15
......@@ -54,7 +54,9 @@
</cr-button>
</p>
<p v-if="overtime" class="btn">
<cr-button type="default" class="btn-default" @click="goOrderList">我的订单</cr-button>
<cr-button v-if="isOrder" type="default" class="btn-default" @click="goOrderList"
>我的订单</cr-button
>
<cr-button type="primary" class="btn-primary" @click="goHome">返回商城</cr-button>
</p>
<p class="placeholder" />
......@@ -103,7 +105,6 @@ import { goUrlExtends } from './extends';
import cookies from '@/service/cookieStorage.service';
import {
codeArr,
CASH_PAY,
CREDIT_PAY,
PAY_SUCCESS,
creditStatus,
......@@ -113,8 +114,7 @@ import {
isDetentionFn,
havePayingOrder,
filterAllPayList,
PAYMENT_CODE_PAY,
CASH_PAY_SUCCESS,
PAYMENT_CODE_PAY, // 支付密码
ACCOUNT_APPLY_FAIL,
creditPayStatusType,
ACCOUNT_APPLY_SUCCESS,
......@@ -125,13 +125,13 @@ import {
pay,
prepay,
getCoupon,
h5AppyUrl,
ocrFaceId,
queryPayInfo,
kaGetNextUrl,
reissueContract
} from '@/api/pay.api.js';
import { saTrackEvent } from '@/service/sa.service';
const VCC_CHANNEL = localStorage.get('vccChannel');
const VCC_CHANNEL = localStorage.get('vccChannel') || '';
let Current_Url = null;
export default {
components: {
......@@ -147,6 +147,7 @@ export default {
extends: goUrlExtends,
data() {
return {
isOrder: true,
error: '',
random: '',
orderNo: '',
......@@ -185,8 +186,7 @@ export default {
payContractInfo: {},
isCheckAgreement: false,
mergePayPretreatmentInfo: {},
tradeType: isWechat ? 'JSAPI' : 'MWEB',
amountInfo: {}
tradeType: isWechat ? 'JSAPI' : 'MWEB'
};
},
computed: {
......@@ -194,9 +194,9 @@ export default {
return this.isRiskLimit();
},
amount() {
return IS_THIRD_PAY(this.payType) || !this.selectedCoupon.faceValue
return IS_THIRD_PAY(this.payType) || !this.selectedCoupon.faceValueNew
? this.displayInfo.orderAmt
: (this.displayInfo.orderAmt - this.selectedCoupon.faceValue).toFixed(2);
: (this.displayInfo.orderAmt - this.selectedCoupon.faceValueNew).toFixed(2);
},
isShowProtocol() {
return (
......@@ -207,7 +207,7 @@ export default {
},
canUseAmount() {
return (
((this.selectedCoupon?.faceValue && +this.selectedCoupon.faceValue) || 0) +
((this.selectedCoupon?.faceValueNew && +this.selectedCoupon.faceValueNew) || 0) +
((this.displayInfo?.creditPayInfo?.canAmt && +this.displayInfo.creditPayInfo.canAmt) || 0) -
((this.displayInfo?.orderAmt && +this.displayInfo.orderAmt) || 0)
);
......@@ -219,6 +219,8 @@ export default {
}
},
mounted() {
this.getQuery();
this.setIsOrder();
this.orderNo = this.$route.query.orderNo || cookies.get('orderNo')?.orderNo;
cookies.set('orderNo', { orderNo: this.orderNo });
if (this.$route?.query?.ocrflag) {
......@@ -234,15 +236,23 @@ export default {
this.getCouponList(this.orderNo);
},
methods: {
getQuery() {
this.returnUrl = cookies.get('returnUrl') || '';
if (localStorage.get('hideOrder')) {
this.isOrder = false;
}
},
setIsOrder() {
const { hideOrder } = this.$route.query || {};
if (hideOrder) {
localStorage.set('hideOrder', hideOrder);
}
},
/* 查询支付信息 */
async queryPayInfo() {
console.log({
orderNo: this.orderNo,
isUsedMergePayMethod: false
});
const [data, error] = await queryPayInfo({
orderNo: this.orderNo,
isUsedMergePayMethod: false
isUsedMergePayMethod: cookies.get('source') !== 'tob' // 是否需要组合支付，true需要。false不需要
});
if (error && codeArr.indexOf(error?.response?.businessCode) < 0) {
this.payResult('Fail');
......@@ -333,7 +343,7 @@ export default {
const { accountStatus, riskManagementAmt } = this.creditPayInfo;
const { orderAmt } = this.displayInfo;
if (accountStatus === ACCOUNT_APPLY_SUCCESS) {
const coupon = +this.selectedCoupon.faceValue || 0;
const coupon = +this.selectedCoupon.faceValueNew || 0;
return +riskManagementAmt + coupon < +orderAmt;
} else {
return false;
......@@ -362,7 +372,7 @@ export default {
};
} else if (accountStatus === ACCOUNT_APPLY_SUCCESS) {
const finalCount = this.showCoupon
? (this.displayInfo.orderAmt - (this.selectedCoupon.faceValue || 0)).toFixed(2)
? (this.displayInfo.orderAmt - (this.selectedCoupon.faceValueNew || 0)).toFixed(2)
: this.displayInfo.orderAmt;
const txt = `实际支付${finalCount || '0.00'}`;
this.accountS = {
......@@ -384,7 +394,6 @@ export default {
this.payCouponList = [];
if (data && data.coupons) {
data.coupons.forEach(item => {
// 享花券
if (item.couponCategory === 21) {
this.payCouponList.push({
...item,
......@@ -396,13 +405,6 @@ export default {
}
},
nextAction: throttle(function() {
const trackParams = {
order_id: this.orderNo,
pay_method: this.payType,
vcc_state: !IS_THIRD_PAY(this.payType) ? this.creditPayInfo?.accountStatus : '',
buttons_name: this.accountS.text
};
cookies.set('payTrackInfo', trackParams);
if (this.isShowProtocol) {
if (!this.isCheckAgreement) {
this.$toast('请仔细阅读并同意相关协议');
......@@ -410,9 +412,6 @@ export default {
}
this.reissueContract();
}
saTrackEvent('H5_CheckOutCounterConfirmPayBtnClick', {
order_type: '0元购'
});
this.accountS.fn();
}, 1000),
/* 预支付 */
......@@ -424,13 +423,7 @@ export default {
}
this.error = '';
this.setAmount();
if (
!params &&
!this.isDetention &&
IS_THIRD_PAY(this.payType) &&
this.payType !== CASH_PAY &&
!isOcr
) {
if (!params && !this.isDetention && IS_THIRD_PAY(this.payType) && !isOcr) {
this.isDetention = true;
isDetentionFn.call(this);
return;
......@@ -483,15 +476,7 @@ export default {
this.pwdModal && this.retrieve();
return;
}
// TODO 此处在获取与支付信息后，，跳转前通过判断渠道号，来判断是否在app中的打开，来规避支付等待页中的schema跳转问题
if (localStorage.get('vccChannel')) localStorage.set('isAppInner', true);
const {
creditPayInfo = {},
wxPayInfo = {},
flowOrderNo,
aliPayInfo = {},
vmPayInfo = {}
} = data;
const { creditPayInfo = {}, wxPayInfo = {}, flowOrderNo, aliPayInfo = {} } = data;
const creditPayStatus = creditPayInfo.creditPayStatus;
this.flowOrderNo = flowOrderNo;
if (wxPayInfo.mwebUrl) {
......@@ -529,9 +514,6 @@ export default {
});
this.close();
this.goOcr();
} else if (vmPayInfo?.vmPayStatus === CASH_PAY_SUCCESS) {
!params && this.pay({ flowOrderNo: this.flowOrderNo });
params && this.payResult('Success');
}
},
payResult(type, error) {
......@@ -541,18 +523,12 @@ export default {
query: {
reason: error,
orderNo: this.orderNo,
payType: this.payType,
finalAmt: this.amountInfo.finalAmt || '',
freeAmount: this.amountInfo.freeAmount || ''
payType: this.payType
}
});
},
/* 选择支付方式 */
changePayType(type, mergePayPretreatmentInfo) {
if (this.payType === CASH_PAY) {
this.$toast('请选择现金券支付！');
type = CASH_PAY;
}
this.payType = type;
this.isDetention = false;
this.thirdPayList = filterAllPayList(type, this.thirdPayList);
......@@ -566,6 +542,12 @@ export default {
/* 选取优惠券 */
handleSelectCoupon(id, selectedCoupon) {
this.selectedCoupon = selectedCoupon || {};
if (!('faceValueNew' in this.selectedCoupon) && 'faceValue' in this.selectedCoupon) {
this.selectedCoupon.faceValueNew = this.selectedCoupon.faceValue;
}
if (!('limitAmountNew' in this.selectedCoupon) && 'limitAmount' in this.selectedCoupon) {
this.selectedCoupon.limitAmountNew = this.selectedCoupon.limitAmount;
}
this.getBtnStatus(this.isRiskLimit());
this.couponPopup = false;
},
......@@ -589,6 +571,15 @@ export default {
},
/* 进入h5授信流程 */
async goApply() {
if (this.$route.query.ka) {
this.getKaGetNextUrl();
return;
}
const [{ url }] = await h5AppyUrl();
if (!url) return;
window.location.href = `${url}&returnUrl=${window.location.origin}/pay&from=pay`;
},
async getKaGetNextUrl() {
const [{ nextUrl }] = await kaGetNextUrl();
if (!nextUrl) return;
window.location.href = `${nextUrl}&returnUrl=${window.location.origin}/pay&from=pay`;
......@@ -611,7 +602,9 @@ export default {
},
/* 忘记密码 */
retrieveLink() {
let url = `${this.creditPayInfo.forgetPwdJumpUrl}&vccChannel=${VCC_CHANNEL}&redirectUrl=${window.location.href}`;
const { orderNo, hideOrder, returnUrl } = this.$route.query || {};
const redirectUrl = `${window.location.origin}${window.location.pathname}?orderNo=${orderNo}&hideOrder=${hideOrder}&returnUrl=${returnUrl}`;
let url = `${this.creditPayInfo.forgetPwdJumpUrl}&vccChannel=${VCC_CHANNEL}&redirectUrl=${redirectUrl}`;
url = url.replace('{token}', localStorage.get('vccToken'));
window.location.href = url;
},
......@@ -619,7 +612,7 @@ export default {
return Object.keys(obj);
},
setAmount() {
const faceValue = +this.selectedCoupon?.faceValue || 0;
const faceValue = +this.selectedCoupon?.faceValueNew || 0;
const orderAmt = +this.displayInfo?.orderAmt || 0;
const finalAmt =
IS_THIRD_PAY(this.payType) || !this.showCoupon
......@@ -627,7 +620,6 @@ export default {
: (orderAmt - faceValue || 0).toFixed(2);
const freeAmount =
!IS_THIRD_PAY(this.payType) && this.showCoupon ? faceValue || '0.00' : '0.00';
this.amountInfo = { finalAmt, freeAmount };
cookies.set('amount', { finalAmt, freeAmount });
},
async reissueContract() {
......@@ -640,5 +632,5 @@ export default {
</script>
<style lang="less">
@import './index';
@import './index.less';
</style>
src/views/pay/payWaiting.vue
View file @ b49f9b15
......@@ -5,7 +5,7 @@
width="63px"
height="63px"
class="info__image"
src="../../assets/images/pay/paying.png"
src="@/assets/images/pay/paying.png"
/>
<div v-if="init" class="info__desc">
<p class="info__text">
......@@ -16,16 +16,16 @@
<p class="tips">
努力返回支付结果中，请留心查看！
</p>
<div class="actions">
<div :class="['actions', !isOrder && 'no-order']">
<cr-button
class="actions__back"
:plain="true"
type="primary"
shape="circle"
@click="goHome('正在支付')"
>返回首页</cr-button
>{{ returnUrl ? '返回秒杀' : '返回首页' }}</cr-button
>
<cr-button shape="circle" type="primary" @click="goOrderDetail('正在支付')"
<cr-button v-if="isOrder" shape="circle" type="primary" @click="goOrderDetail('正在支付')"
>查看订单</cr-button
>
</div>
......@@ -34,9 +34,9 @@
<script>
import { queryPayStatus } from '@/api/pay.api';
import cookies from '@/service/cookieStorage.service';
import localStorage from '@/service/localStorage.service';
import { goUrlExtends } from './extends';
import { isIOS } from '@/service/validation.service';
import { isApp } from '@/service/validation.service';
import localStorage from '@/service/localStorage.service';
export default {
components: {},
extends: goUrlExtends,
......@@ -46,20 +46,20 @@ export default {
timer: null,
time: 10,
init: false,
isWx: false
returnUrl: '',
isOrder: true
};
},
created() {
this.orderNo = this.$route.query.orderNo || cookies.get('orderNo')?.orderNo;
this.isWx = this.$route.query.isWx;
if (!localStorage.get('isAppInner')) {
const schema = isIOS ? 'xincheng://' : 'app://xincheng/splash';
if (!isApp) {
setTimeout(() => {
window.location.href = schema;
window.location.href = 'xyqb://openApp';
}, 2000);
}
},
mounted() {
this.getQuery();
this.$dialog({
message: '请确认订单已完成支付',
confirmButtonText: '已完成支付',
......@@ -78,6 +78,12 @@ export default {
clearInterval(this.timer);
},
methods: {
getQuery() {
this.returnUrl = cookies.get('returnUrl') || '';
if (localStorage.get('hideOrder')) {
this.isOrder = false;
}
},
loop() {
this.query();
this.timer = setInterval(() => {
......@@ -92,14 +98,10 @@ export default {
},
goSuccess() {
// 支付成功
this.$router.push({ name: 'paySuccess' });
this.$router.replace({ name: 'paySuccess', query: { orderNo: this.orderNo } });
},
goPay() {
if (this.isWx) {
this.$router.go(-2);
return;
}
this.$router.go(-1);
this.$router.replace({ name: 'pay', query: { orderNo: this.orderNo } });
},
async query() {
const [data, error] = await queryPayStatus({ orderNo: this.orderNo });
......@@ -166,7 +168,9 @@ export default {
flex-direction: row;
margin-top: @padding-lg;
justify-content: space-between;
&.no-order {
justify-content: center;
}
&__back {
color: @cherry-color-error;
border: 1px solid @cherry-color-error;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment