frontend_h5/treegitee/pages/product/Pay.vue

114 lines
3.4 KiB
Vue
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="bgwhite" style="height: 100vh;">
<view class="flex_column p30 mt30">
<text class="f26" style="color:#9E9E9E;">温馨提示</text>
<view class="mt20 f26" style="color:#9E9E9E;">
<view>1.此商品不支持七天无理由退换货如非您所需请谨慎购买;</view>
<view>2.刷信誉兼职等理由均为欺诈骗术请勿相信任何诱导行为</view>
</view>
<text class="f26 mt30" style="color: #4D4D4D;">待充账号</text>
<u--input class="mt30" fontSize="14" placeholder="请输入手机号" border="surround" v-model="form.phone"></u--input>
</view>
<view style="width: 100%;height: 30rpx;background: #f5f5f5;"></view>
<view class="ptb30 plr50">
<view class="flex_start">
<view>
<image :src="info.img " style="width: 168rpx;height: 168rpx;border-radius: 12rpx;" mode="">
</image>
</view>
<view class="ml30 flex_column" style="height: 168rpx;width: 100%;">
<view class="flex_between flex_items">
<view class="f30 bold three" style="width: 320rpx;">{{info.name}}</view>
<text class="f24" style="color: #4d4d4d;">{{info.price}} 积分</text>
</view>
<text class="mt30 f26" style="color: #888;">数量1</text>
</view>
</view>
<view class="flex_between flex_items mt30 pb30 bbe9s">
<view class="flex_start flex_items">
<image :src="imgUrl+'jian.png'" style="width: 24rpx;height: 24rpx;" mode=""></image>
<text class="ml10 f22" style="color: #4D4D4D;">积分立减</text>
</view>
<view class="flex_start flex_items f22" style="color: #4D4D4D;">
<text class="mr20">暂无可用</text>
<u-icon name="arrow-right" color="#4d4d4d" size="15"></u-icon>
</view>
</view>
<view class="flex_end flex_items mt40 f26" style="color: #00524C;">
小计{{info.price}}积分
</view>
</view>
<view class="flex_items flex_center" style="position: fixed;left: 0;bottom: 20rpx;width: 100%;">
<view
style="width: 638rpx;height: 108rpx;background: linear-gradient(90deg, #FF898E 0%, #F43139 100%);border-radius: 54rpx;"
class="f32 flex_items flex_center" @click="submit">
<text style="color: #fff;">立即支付{{info.price}}积分</text>
</view>
</view>
<Ywatermark :info="'蓝色兄弟'"></Ywatermark>
</view>
</template>
<script>
export default {
data() {
return {
form: {
phone: "",
},
info: {}
}
},
onLoad(options) {
this.info = JSON.parse(options.data)
},
methods: {
submit() {
let that = this
uni.showModal({
title: "支付",
content: "确认支付" + that.info.price + "积分?",
success: function(res) {
if (res.confirm) {
uni.showLoading({
title: "支付中..."
})
that.form.product_id = that.info.id
that.form.pay_type = 1
that.api.createorder(that.form).then((res) => {
console.log(res)
if (res.data.code == 200) {
uni.reLaunch({
url: '/pages/product/paying?order_no=' + res.data.data
.order_no + "&money=" + that.info.price
})
} else {
uni.showToast({
icon: "none",
title: res.data.message
})
}
uni.hideLoading()
})
}
}
})
}
}
}
</script>
<style>
page {
background: #f5f5f5 !important;
}
.three {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}
</style>