pco/app-ui/pages/business-order/createOrder.vue

<template>
  <view>
    <view class="box">
      <view class="item">
        <view class="l">客户名称：</view>
        <view class="r">
          {{ form.customerName }}
        </view>
      </view>
      <view class="item">
        <view class="l">订单号：</view>
        <view class="r">
          {{ form.no }}
        </view>
      </view>
      <view class="item">
        <view class="l">业务费用：</view>
        <view class="r">
          {{ form.itemPrice }}元

        </view>
      </view>
      <view class="item">
        <view class="l" style="flex: 7;">境外车入场：</view>
        <view class="r">
          {{ form.realInTime }}
        </view>
      </view>
      <view class="item">
        <view class="l" style="flex: 7;">
          <text style="color: red;">*</text>
          境外车预计离场：
        </view>
        <view class="r">
          <uni-datetime-picker placeholder="离场时间" :start="new Date().getTime()" type="datetime"
                               @change="jwCaroTimeChange"
                               v-model="form.outDayTime"/>
        </view>
      </view>
      <view class="item">
        <view class="l">停车费用：</view>
        <view class="r">
          {{ form.partMoney }}
          <text v-if="form.partMoney">元</text>
        </view>
      </view>
      <view class="item">
        <view class="l" style="flex: 7;">中国车入场：</view>
        <view class="r">
          {{ form.chinaCarInTime }}
        </view>
      </view>
      <view class="item">
        <view class="l" style="flex: 7;">
          <text style="color: red;">*</text>
          中国车预计离场：
        </view>
        <view class="r">
          <uni-datetime-picker placeholder="离场时间" :start="new Date().getTime()" type="datetime"
                               @change="chinaCaroTimeChange"
                               v-model="form.chinaCarOutTime"/>
        </view>
      </view>
      <view class="item">
        <view class="l">停车费用：</view>
        <view class="r">
          {{ form.chinaPartMoney }}
          <text v-if="form.chinaPartMoney">元</text>
        </view>
      </view>
      <view class="item">
        <view class="l">总计费用：</view>
        <view class="r">
          {{ form.totalMoney }}
        </view>
      </view>
    </view>
    <u-button type="primary" @click="confirmFn">确认生成</u-button>
  </view>
</template>

<script>
export default {
  data() {
    return {
      id: '',
      form: {
        partMoney: 0,
        outDayTime: '',
        chinaCarOutTime: ''
      },
    }
  },
  onLoad(options) {
    this.id = options.id;
  },
  onShow() {
    this.getBusinessById();
  },
  methods: {
    jwCaroTimeChange(date) {
      if (!date || date.length <= 12) {
        this.form.outDayTime = '';
        this.form.partMoney = 0;
        this.$common.toast('境外车离场时间不正确');
        return;
      }
      this.form.outDayTime = date;
      let o = Object.assign(this.form);
      o.items = null;
      o.outDayTime = date;
      this.$api.calJwPartMoney(this.$common.removeNull(o)).then(resp => {
        this.form = resp.data;
      })
    },
    chinaCaroTimeChange(date) {
      if (!date) {
        this.form.chinaCarOutTime = '';
        this.form.chinaPartMoney = 0;
        this.$common.toast('请选择离场时间');
        return;
      }
      if (date.length <= 12) {
        this.$common.toast('请选择时间');
        return;
      }
      this.form.chinaCarOutTime = date;
      let o = Object.assign(this.form);
      o.items = null;
      this.$api.calChinaPartMoney(this.$common.removeNull(o)).then(resp => {
        this.form = resp.data;
      })
    },
    getBusinessById() {
      this.$api.getBusinessById({
        id: this.id
      }).then(resp => {
        this.form = resp.data;
      })
    },
    confirmFn() {
      if (!this.form.chinaCarOutTime || !this.form.outDayTime) {
        this.$common.toast('请选择时间')
        return;
      }
      this.form.items = null;
      this.$api.completeOrder(this.$common.removeNull(this.form)).then(Resp => {
        this.$common.toast('操作成功');
        setTimeout(() => {
          this.$common.back()
        }, 500)
      })
    }
  }
}
</script>

<style lang="scss">
page {
  background-color: #fff;
}

@import '@/common/common.scss';
</style>