<template>
  <Page name="upload-receipt" flank>
    <template #content>
      <u-form :model="form" ref="uForm" labelWidth="100">
        <view class="card">
          <u-form-item label="上传回单">
            <z-upload v-model="form.receiptAttachment" :limit="20"></z-upload>
          </u-form-item>
        </view>
      </u-form>
    </template>
    <template #footer>
      <u-button type="primary" @tap="submit">确认上传</u-button>
    </template>
  </Page>
</template>

<script>
import ZUpload from '../../components/zee/z-upload.vue';
import dayjs from 'dayjs';

export default {
  name: 'upload-receipt',
  components: { ZUpload },
  data() {
    return {
      form: {
        receiptAttachment: '',
      },
      item: {},
    };
  },
  onLoad(options) {
    if (options.code) {
      this.initData(options.code);
    }
  },
  methods: {
    initData(code) {
      uni.$u.api.freightOrder.getDetail({ code }).then(res => {
        this.item = res.result || {};
        this.form.receiptAttachment = this.item.receiptAttachment;
      });
    },
    submit() {
      uni.$u.api.freightOrder.modifyReceiptAttachment({ code: this.item.code, ...this.form }).then(res => {
        if (res.success) {
          uni.showToast({ title: '操作成功', icon: 'none' });
          this.getOpenerEventChannel().emit('refreshData');
          setTimeout(() => uni.navigateBack(), 500);
        }
      });
    },
  },
};
</script>

<style lang="scss">
.page-upload-receipt {
  &__footer {
    background: $color-white;
  }
  .card {
    color: #999999;
    background-color: $color-white;
    border-radius: $radius-md;
    box-shadow: $shadow-normal;
    .u-form-item {
      padding-left: $padding-md !important;
      padding-right: $padding-sm !important;
    }
  }
}
</style>
