<!--
@name: 待审核-订单信息
@author: 张泽贤
@time: 2022-04-12
-->
<template>
  <div>
    <p-form-model ref="formTarget" :model="form" :label-col="{ span: 8 }" :wrapper-col="{ span: 16 }" class="plg-grid-from">
      <p-card title="运单信息" style="margin-bottom: 10px">
        <a-row>
          <a-col :span="6">
            <p-form-model-item label="运单号">{{ form.shipbillNo }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="货主">{{ form.cargoOwnerName }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="订单号">{{ form.orderNo }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="WMS单号">{{ form.wmsOrderNo }}</p-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="6">
            <p-form-model-item label="订单类型">{{ form.orderTypeName }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="业务类型">{{ form.orderBusinessTypeName }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="配送方式">{{ form.deliveryMethodTypeName }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="运输模式">{{ form.transportTypeName }}</p-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="6">
            <p-form-model-item label="温度要求">{{ form.temperatureRequirementName }}</p-form-model-item>
          </a-col>
          <a-col :span="6" v-show="isOrganization">
            <p-form-model-item label="所属组织">{{ form.organizationName }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="所属部门">{{ form.departmentName }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="备注">{{ form.memo }}</p-form-model-item>
          </a-col>
        </a-row>
        <extendedField :mextendedField_list="mextendedField_list" type="view" :form="form"></extendedField>
      </p-card>
      <p-card title="时间信息" style="margin-bottom: 10px">
        <a-row>
          <a-col :span="24">
            <p-form-model-item label="订单下单日期" :label-col="{ span: 2 }" :wrapper-col="{ span: 22 }">{{ form.orderDate }}</p-form-model-item>
          </a-col>
          <a-col :span="24">
            <p-form-model-item label="预计提货时间" :label-col="{ span: 2 }" :wrapper-col="{ span: 22 }">{{ form.estimatedPickupStartTime }}</p-form-model-item>
          </a-col>
          <a-col :span="24">
            <p-form-model-item label="预计送达时间" :label-col="{ span: 2 }" :wrapper-col="{ span: 22 }">{{ form.estimatedDeliveryStartTime }}</p-form-model-item>
          </a-col>
          <a-col :span="24">
            <p-form-model-item label="时效" :label-col="{ span: 2 }" :wrapper-col="{ span: 22 }">{{ form.transportAging }}</p-form-model-item>
          </a-col>
        </a-row>
      </p-card>
      <p-card title="发货方信息" style="margin-bottom: 10px">
        <a-row>
          <a-col :span="6">
            <p-form-model-item label="发货方类型">{{ form.shipperTypeName }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="发货方单位">{{ form.shipperUnitName }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="发货方">{{ form.shipperName }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="始发地">{{ form.shipperProvinceCityDistrict }}</p-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="6">
            <p-form-model-item label="联系人">{{ form.shipperContact }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="手机号">{{ form.shipperPhoneNumber }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="座机号">{{ form.shipperLandlineNumber }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="邮箱">{{ form.shipperEmail }}</p-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="6">
            <p-form-model-item label="关联方手机号"></p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="详细地址">{{ form.shipperAddress }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="备注">{{ form.shipperMemo }}</p-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="12">
            <p-form-model-item label="">
              <p-checkbox v-model="form.shipperPickUpSign" readOnly>提货签到</p-checkbox>
              <p-checkbox v-model="form.shipperAutoPickUpSign" readOnly>自动签到</p-checkbox>
              <p-checkbox v-model="form.shipperPickUpPicture" readOnly>提货图片</p-checkbox>
            </p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="默认提货围栏">{{ form.shipperPickUpRail }}</p-form-model-item>
          </a-col>
        </a-row>
      </p-card>
      <p-card title="收货方信息" style="margin-bottom: 10px">
        <a-row>
          <a-col :span="6">
            <p-form-model-item label="收货方类型">{{ form.consigneeTypeName }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="收货方单位">{{ form.consigneeUnitName }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="收货方">{{ form.consigneeName }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="目的地">{{ form.consigneeProvinceCityDistrict }}</p-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="6">
            <p-form-model-item label="联系人">{{ form.consigneeContact }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="手机号">{{ form.consigneePhoneNumber }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="座机号">{{ form.consigneeLandlineNumber }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="邮箱">{{ form.consigneeEmail }}</p-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="6">
            <p-form-model-item label="关联方手机号"></p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="详细地址">{{ form.consigneeAddress }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="备注">{{ form.consigneeMemo }}</p-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="12">
            <p-form-model-item label="">
              <p-checkbox v-model="form.consigneeDeliverySign" readOnly>送达签到</p-checkbox>
              <p-checkbox v-model="form.consigneeAutoDeliverySign" readOnly>自动签到</p-checkbox>
              <p-checkbox v-model="form.consigneeDeliveryPicture" readOnly>送货图片</p-checkbox>
              <p-checkbox v-model="form.requestReceipt" readOnly>是否要求回单</p-checkbox>
            </p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="默认提货围栏">5KM</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="回单期限">5天</p-form-model-item>
          </a-col>
        </a-row>
      </p-card>
      <p-card title="商品信息" style="margin-bottom: 10px">
        <p-table
          ref="goodsTable"
          dragle
          bordered
          :extendedObjectCode="'17'"
          row-key="id"
          :scroll="{ x: true, y: 300 }"
          :columns="goods_columns"
          :data-source.sync="goodsDataSource"
          :remote-url="goodsListRemoteUrl"
          :remoteData="goodsListParams"
          :rowSelectType="false"
          :selectedRowKeys.sync="goodsSelectedRowKeys"
          :autoLoad="false"
        >
        </p-table>
        <a-row>
          <a-col :span="6">
            <p-form-model-item label="总件数">{{ form.goodsTotalPcs }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="总重量">{{ form.goodsTotalWeight }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="总体积">{{ form.goodsTotalVolume }}</p-form-model-item>
          </a-col>
        </a-row>
      </p-card>
      <p-card title="包裹信息" style="margin-bottom: 10px">
        <p-table
          ref="packTable"
          dragle
          bordered
          row-key="id"
          :scroll="{ x: true, y: 300 }"
          :columns="pack_columns"
          :data-source.sync="packDataSource"
          :remote-url="packListRemoteUrl"
          :remoteData="packListParams"
          :rowSelectType="false"
          :selectedRowKeys.sync="packSelectedRowKeys"
          :autoLoad="false"
        >
        </p-table>
        <a-row>
          <a-col :span="6">
            <p-form-model-item label="总件数">{{ form.pkgTotalPcs }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="总拼箱数">{{ form.pkgTotalLclPiece }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="总整件数">{{ form.pkgTotalWholePiece }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="总重量">{{ form.pkgTotalWeight }}</p-form-model-item>
          </a-col>
          <a-col :span="6">
            <p-form-model-item label="总体积">{{ form.pkgTotalVolume }}</p-form-model-item>
          </a-col>
        </a-row>
      </p-card>
    </p-form-model>
  </div>
</template>

<script>
import { setGoodsColums, setPackColums } from '@/blocks/components/scheduling/js/table/tableConfig.js'
import extendedField from '@/blocks/extendedField'

export default {
  components: { extendedField },
  props: {
    editId: {
      type: String,
      default: '',
    },
    viewUrl: {
      type: Function,
      default: null,
    },
    goodsListRemoteUrl: {
      type: Object,
      default: () => ({}),
    },
    packListRemoteUrl: {
      type: Object,
      default: () => ({}),
    },
    isOrganization: {
      type: Boolean,
      default: true,
    },
    mextendedField_list: {
      type: Array,
      default: () => [],
    },
    goods_tableExtendedField: {
      type: Array,
      default: () => [],
    },
  },
  data() {
    return {
      form: {},

      // 商品表格
      goodsDataSource: [],
      goodsSelectedRowKeys: [],
      // goodsListRemoteUrl,
      goodsListParams: {},
      goods_columns: setGoodsColums(this, this.goods_tableExtendedField),

      // 包裹表格
      packDataSource: [],
      packSelectedRowKeys: [],
      // packListRemoteUrl,
      packListParams: {},
      pack_columns: setPackColums(this),
    }
  },
  mounted() {
    this.View()
  },
  methods: {
    View() {
      this.goodsListParams = { shipbillId: this.editId }
      this.packListParams = { shipbillId: this.editId }
      if (typeof this.viewUrl === 'function') {
        this.viewUrl({ shipbillId: this.editId }).then((res) => {
          if (res.success) {
            res.data.shipperPickUpSign = res.data.shipperPickUpSign === 1
            res.data.shipperAutoPickUpSign = res.data.shipperAutoPickUpSign === 1
            res.data.shipperPickUpPicture = res.data.shipperPickUpPicture === 1
            res.data.consigneeDeliverySign = res.data.consigneeDeliverySign === 1
            res.data.consigneeAutoDeliverySign = res.data.consigneeAutoDeliverySign === 1
            res.data.consigneeDeliveryPicture = res.data.consigneeDeliveryPicture === 1
            res.data.requestReceipt = res.data.requestReceipt === 1
            this.form = { ...res.data }
          } else {
            this.$exception(res)
          }
        })
      }
    },
  },
}
</script>