/*
 *@description:查看
 *@author: hudw
 *@date: 2022-04-26 16:41:46
*/
<template>
  <p-card v-if="display" class="full-card-panel" :bordered="false" :loading="pageLoad">
    <a-space slot="extra">
      <p-search-modal v-show="false" v-bind="historyOrderModal" @cancel="isShow = false" @change="historyOK" :modalConfig="{ visible: isShow }" />
      <p-button type="primary" :disabled="load" @clickSync="isShow = true" v-action:historyBtn>引用历史运单</p-button>
      <p-button type="primary" :disabled="load" @clickSync="!load && $refs.form.save(0)" v-action:submit>保存</p-button>
      <p-button type="primary" :disabled="load" @clickSync="!load && $refs.form.save(1)" v-action:saveSubmit>保存并提交</p-button>
      <p-button :disabled="load">打印</p-button>
      <p-button @click="!load && $refs.form.back(record && record.id, false)" :disabled="load">取消</p-button>
    </a-space>
    <a-space slot="title">
      <a-icon :disabled="load" type="arrow-left" @click="!load && $refs.form.back(record && record.id, false)" :style="{ color: '#08c' }" />
      {{ title }}
    </a-space>
    <formContent ref="form" v-bind="$attrs" v-on="$listeners" :options="options" :st="st" @loading="onloading" :record="dataView"></formContent>
  </p-card>
</template>
<script>
import formContent from '../formDetails/formContent.vue';
import { mainViewUrl } from '../../api.js';
import historyOrderModal from './historyOrderModal.js';

const titleArr = ['', '查看', '新建', '修改', '复制'];
const pageName = {
  main: '订单信息',
  children: '商品信息',
};

export default {
  inheritAttrs: false,
  components: { formContent },
  data() {
    return {
      display:false,
      isShow: false,
      historyOrderModal: historyOrderModal(this),
      ...this.$attrs,
      shipbillId: '',
      dataView: null,
      load: true,
      pageLoad: false,
    };
  },
  props: {
    record: {
      type: null,
    },
    options: {
      type: Object,
      default() {
        return {}
      }
    },
    st: {
      type: Number,
      default: 0,
    },
  },
  mounted() {},
  watch: {
    st(value) {
      if (value === 0) {
        this.load = true;
        this.dataView = null;
        this.shipbillId = '';
        this.$refs.form.init(2, null);
      } else if (value === 2) {
        this.load = false;
      }
      this.display=true

    },
    record(value) {
      if (this?.$el?.style?.display == 'none') return;

      if (this.st > 0) {
        if (!value) {
          this.shipbillId = '';
          this.$refs?.form?.init(1, value);
          return;
        }
        this.getView(value.shipbillId);
      }
    },
  },
  computed: {
    title() {
      let { formName } = this.$attrs;
      return titleArr[this.st] + pageName[formName];
    },
  },
  methods: {
    historyOK(event, value, dataArr, form) {
      let data = dataArr[0];
      this.isShow = false;
      if (data && data.shipbillId) {

        this.getView(data.shipbillId, false).then((data) => {
          let st = this.st === 2 ? 4 : this.st;
          if (this.record) {
            let { shipbillId, shipbillNo, orderNo, wmsOrderNo } = this.record;
            data = { ...data, shipbillId, shipbillNo, orderNo, wmsOrderNo };
          }
          this.$refs.form.init(st, data);
        });
      }
    },
    onloading(is) {
      this.load = is;
    },
    form() {
      let { st, formName } = this.$attrs;
      if (this.$refs.form.$refs[formName]) {
        return this.$refs.form.$refs[formName].form;
      }
      return undefined;
    },
    getView(shipbillId, has = true) {
      this.pageLoad = true;
      return this.axios({ url: mainViewUrl, method: 'post', data: { shipbillId } })
        .then((response) => {
          this.pageLoad = false;
          this.load = false;

          if (has && response.success) {
            this.shipbillId = shipbillId;
            this.dataView = { ...response.data, ...this.record };
          }else if (!response.success) {
            this.$exception(response)
          }
          return response.data;
        }).finally(() => {
          this.pageLoad = false;
          this.load = false;
        });
    },
    reload(args) {
      return this.$refs.form.$refs.table.reload(args);
    },
  },
};
</script>
<style lang='less'>
</style>