|
@@ -0,0 +1,178 @@
|
|
|
+<template>
|
|
|
+ <view class="sure-order">
|
|
|
+ <view class="order-detail">
|
|
|
+ <view class="order-title">
|
|
|
+ <uv-text text="订单详情" :customStyle="{
|
|
|
+ fontWeight:'bold'
|
|
|
+ }" size="32"></uv-text>
|
|
|
+ </view>
|
|
|
+ <view class="order-content">
|
|
|
+ <uv-image :src="imageUrl(orderData.rotatingImages) || ''" width="180" height="180" radius="16">
|
|
|
+ </uv-image>
|
|
|
+ <view class="order-content-detail">
|
|
|
+ <uv-text :text="orderData.name" :lines="2" size="28"></uv-text>
|
|
|
+ <uv-text text="x1" type="content" size="28" :customStyle="{
|
|
|
+ background:'#eee',
|
|
|
+ padding:'2rpx 16rpx',
|
|
|
+ borderRadius:'4rpx',
|
|
|
+ margin:'10rpx 0'
|
|
|
+ }"></uv-text>
|
|
|
+ <uv-text :text="orderData.price" type="error" size="32" mode="price"></uv-text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="order-item">
|
|
|
+ <uv-text text="优惠券" size="28"></uv-text>
|
|
|
+ <view class="text-flex"
|
|
|
+ @tap="$navigateTo('/subPages/workarkPage/coupon/coupon?productLevelId=' + orderData.productLevelId + '&price=' + orderData.price)">
|
|
|
+ <text class="order-item-icon">-</text>
|
|
|
+ <uv-text :text="minus" type="error" size="28" mode="price"></uv-text>
|
|
|
+ <uv-icon name="arrow-right" size="32"></uv-icon>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="order-count">
|
|
|
+ <view class="text-flex">
|
|
|
+ <uv-text text="合计:" size="28"></uv-text>
|
|
|
+ <uv-text :text="countPriceData.totalFee" type="error" size="28" mode="price"></uv-text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="hui-button-box">
|
|
|
+ <view class="button-flex">
|
|
|
+ <uv-text :text="countPriceData.totalFee" type="error" size="28" mode="price"></uv-text>
|
|
|
+ <view class="text-flex">
|
|
|
+ <uv-text text="-" type="error" size="24"></uv-text>
|
|
|
+ <uv-text :text="minus" type="error" size="24" mode="price"></uv-text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <uv-button type="primary" text="立即支付" @tap="payment" :disabled="isCount"></uv-button>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import {
|
|
|
+ getServeById,
|
|
|
+ countPriceAPI
|
|
|
+ } from '@/request/api/workark.js'
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ orderId: '',
|
|
|
+ orderData: {
|
|
|
+ price: 0
|
|
|
+ },
|
|
|
+ countPriceData: {
|
|
|
+ productCoupon: [],
|
|
|
+ totalFee: 0
|
|
|
+ },
|
|
|
+ isCount: false,
|
|
|
+ couponChecked: []
|
|
|
+ };
|
|
|
+ },
|
|
|
+ onLoad(body) {
|
|
|
+ this.orderId = body.orderId;
|
|
|
+ uni.$on('changeCoupon', this.changeCoupon);
|
|
|
+ if (this.orderId) this.init();
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ minus() {
|
|
|
+ let data = this.countPriceData.productCoupon || [];
|
|
|
+ let num = 0;
|
|
|
+ for (var i = 0; i < data.length; i++) {
|
|
|
+ num += data[i].minus
|
|
|
+ }
|
|
|
+ return num;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ async init() {
|
|
|
+ let orderData = await getServeById(this.orderId);
|
|
|
+ if (!orderData.state) return;
|
|
|
+ this.orderData = orderData.data;
|
|
|
+ this.countPrice();
|
|
|
+ },
|
|
|
+ imageUrl(data) {
|
|
|
+ if (!data) return '';
|
|
|
+ let imgData = JSON.parse(data)[0];
|
|
|
+ if (!imgData) return '';
|
|
|
+ return imgData.url;
|
|
|
+ },
|
|
|
+ async countPrice() {
|
|
|
+ this.isCount = true;
|
|
|
+ let couponIds = this.couponChecked.map(node => node.id).join(',') || -1;
|
|
|
+ let countPriceData = await countPriceAPI(this.orderData.id, couponIds);
|
|
|
+ this.isCount = false;
|
|
|
+ if (!countPriceData.state) return;
|
|
|
+ this.countPriceData = countPriceData.data;
|
|
|
+ },
|
|
|
+ changeCoupon(data) {
|
|
|
+ this.couponChecked = data;
|
|
|
+ this.countPrice();
|
|
|
+ },
|
|
|
+ payment() {
|
|
|
+ uni.requestPayment({
|
|
|
+ provider: 'wxpay',
|
|
|
+ timeStamp: String(Date.now()),
|
|
|
+ nonceStr: 'BOSSHAND',
|
|
|
+ package: 'prepay_id=wx3c006d364161d240',
|
|
|
+ signType: 'MD5',
|
|
|
+ paySign: '',
|
|
|
+ success: function(res) {
|
|
|
+ console.log('success:' + JSON.stringify(res));
|
|
|
+ },
|
|
|
+ fail: function(err) {
|
|
|
+ console.log('fail:' + JSON.stringify(err));
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss">
|
|
|
+ .sure-order {
|
|
|
+ padding: 30rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .order-detail {
|
|
|
+ background: #fff;
|
|
|
+ padding: 30rpx;
|
|
|
+ border-radius: 16rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .order-title {
|
|
|
+ padding-bottom: 30rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .order-content {
|
|
|
+ display: flex;
|
|
|
+ }
|
|
|
+
|
|
|
+ .order-content-detail {
|
|
|
+ flex: 1;
|
|
|
+ width: 0;
|
|
|
+ margin-left: 30rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .order-item {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ height: 88rpx;
|
|
|
+ border-bottom: 1px solid $uv-border-color;
|
|
|
+ margin-bottom: 30rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .order-item-icon {
|
|
|
+ color: $uv-error;
|
|
|
+ }
|
|
|
+
|
|
|
+ .order-count {
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-end;
|
|
|
+ }
|
|
|
+
|
|
|
+ .button-flex {
|
|
|
+ margin-right: 20rpx;
|
|
|
+ }
|
|
|
+</style>
|