<template>
  <view>
    <view style="height: 100px; background: #2f4dae"></view>
    <view class="detail-wrap">
      <view>
        <view class="cu-form-group">
          <view class="title">{{$t('订单号')}}</view>
          <view class="content">{{ detail.orderNo }}</view>
        </view>
        <view class="cu-form-group">
          <view class="title">{{$t('唛头')}}</view>
          <view class="content">{{ detail.marks }}</view>
        </view>
        <view class="cu-form-group">
          <view class="title">{{$t('始发地')}}</view>
          <view class="content">{{ detail.logisticsInfoDto && (isChinese ? detail.logisticsInfoDto.startTitleZh : detail.logisticsInfoDto.startTitleEn) || '' }}</view>
        </view>
        <view class="cu-form-group">
          <view class="title">{{$t('目的地')}}</view>
          <view class="content">{{ detail.logisticsInfoDto && detail.logisticsInfoDto[isChinese ? 'destTitleZh' : 'destTitleEn'] || '' }}</view>
        </view>
      </view>
      <view>
        <view class="cu-form-group">
          <view class="title">{{$t('发件人')}}</view>
          <view class="content">{{ detail.consignorVO && detail.consignorVO.name || '' }}</view>
        </view>
        <view class="cu-form-group">
          <view class="title">{{$t('发件人电话')}}</view>
          <view class="content">{{ detail.consignorVO && (detail.consignorVO.countryCode + detail.consignorVO.phone) || '' }}</view>
        </view>
        <view class="cu-form-group">
          <view class="title">{{$t('收件人')}}</view>
          <view class="content">{{ detail.consigneeVO && detail.consigneeVO.name || '' }}</view>
        </view>
        <view class="cu-form-group">
          <view class="title">{{$t('收件人电话')}}</view>
          <view class="content">{{ detail.consigneeVO &&(detail.consigneeVO.countryCode + detail.consigneeVO.phone) || '' }}</view>
        </view>
      </view>
      <view>
        <view class="cu-form-group">
          <view class="title">{{$t('货运方式')}}</view>
          <view class="content">
            <dict-tag :type="DICT_TYPE.ECW_TRANSPORT_TYPE" :value="detail.transportId" />
          </view>
        </view>
        <view class="cu-form-group" v-if="[3,4].indexOf(detail.transportId)>-1">
          <view class="title">{{$t('出货渠道')}}</view>
          <view class="content">{{ detail.channelName }}</view>
        </view>
        <view class="cu-form-group">
          <view class="title">{{$t('控货')}}</view>
          <view class="content">{{ detail.isCargoControl ?$t('是') : $t('否') }}</view>
        </view>
        <view class="cu-form-group">
          <view class="title">{{$t('入仓类型')}}</view>
          <view class="content">
            <dict-tag :type="DICT_TYPE.ECW_WAREHOUSING_TYPE" :value="detail.warehouseType" />
          </view>
        </view>
        <view class="cu-form-group">
          <view class="title">{{$t('已到箱数')}}/{{$t('总箱数')}}</view>
          <view class="content">
            <text>{{ detail.sumNum }}</text>
            /
            <text>{{ detail.costVO?detail.costVO.totalNum:0 }}</text>
          </view>
        </view>
        <view class="cu-form-group">
          <view class="title">{{$t('送货日期')}}</view>
          <view class="content">{{ detail.deliveryDate }}</view>
        </view>
        <view class="cu-form-group">
          <view class="title">{{$t('单证报关')}}</view>
          <view class="content">
            <dict-tag :type="DICT_TYPE.ECW_CUSTOMS_TYPE" :value="detail.customsType" />
          </view>
        </view>
        <view class="cu-form-group">
          <view class="title">{{$t('特殊需求')}}</view>
          <view class="content">
            <view class="red-badge-wrap" v-if="!!advanceType">
              <template v-for="(item, i) in specialRendering(advanceType)">
                <text class="red-badge" :key="i">({{item.symbol}})</text>
              </template>
            </view>
          </view>
        </view>
      </view>
    </view>

    <view class="bg-white bottom-action top-line">
      <!-- <view class="item"><button class="cu-btn block bg-grey margin-tb-sm lg" @click="print">打印标签</button></view> -->
      <view class="item"><button class="cu-btn block bg-blue margin-tb-sm lg" @click="next">{{$t('下一步')}}</button></view>
    </view>
  </view>
</template>

<script>
import {getChannel, getOrderInfo, getSpecialListByOrderId} from './api'

export default {
  name: 'warehouseing-detail',
  data() {
    return {
      orderNo: null,
      orderId: '',
      detail: {
        // departure: {},
        // objective: {}
      },
      returnLoadId: null,
      advanceType: undefined
    };
  },
  created() {
    // this.detail = JSON.parse(uni.getStorageSync('WarehouseWaitInDetail'))
  },
  methods: {
    specialRendering(val){
      if(val !== undefined){
        let i = val.split(',')
        return this.getDictDatas(this.DICT_TYPE.ORDER_SPECIAL_NEEDS).filter(e => {
          return i.indexOf(e.value) > -1
        }).map(item => {
          // 打字开头的用最后一个字，否则取第一个字
          item.symbol = item.label[0] === '打' ? item.label[item.label.length-1]: item.label[0]
          return item
        })
      }
    },
    getSpecialListByOrderId(){
      getSpecialListByOrderId({orderId: this.orderId}).then(r => {
        this.advanceType = r.map(e => e.advanceType).join(',')
      })
    },
    getData() {
      // if (this.orderNo) {
      // 	getWarehouseWaitInList({ orderNo: this.orderNo }).then(data => {
      // 		this.detail = data.list.length > 0 ? data.list[0] : {};
      //     this.orderId = this.detail.orderId
      getOrderInfo(this.orderId).then(data => {
        // this.detail.customsType = data.customsType
        // this.$set(this.detail, 'customsType', data.customsType)
        // this.$set(this.detail, 'warehouseType', data.warehouseType)
        this.detail = data
        data.channelId && getChannel(data.channelId).then(data => {
          this.$set(this.detail, 'channelName', data.nameZh)
        })
      })
      // });
      // }
    },
    next() {
      let url = './warehousing?orderId=' + this.detail.orderId;
      // if (this.returnLoadId) {
      // 	url += '&returnLoadId=' + this.returnLoadId;
      // }
      uni.navigateTo({
        url: url
      });
    }
  },
  onLoad: function(option) {
    uni.setNavigationBarTitle({
      title:this.$t('订单信息')
    })
    // if ('orderNo' in option) {
    //   this.orderNo = option.orderNo;
    //   this.getData();
    // }
    if ('orderId' in option) {
      this.orderId = option.orderId;
      this.getData();
      this.getSpecialListByOrderId()
    }
    if ('returnLoadId' in option) {
      this.returnLoadId = option.returnLoadId;
    }
  },
  computed: {
    isChinese(){
      return uni.getLocale() === 'zh-Hans'
    }
  }
};
</script>

<style scoped lang="scss">
.detail-wrap {
  margin: -75px 12px 0;
  // border-top-left-radius: 8px;
  // border-top-right-radius: 8px;
  padding-bottom: 88px;
  > view {
    border-radius: 8px;
    background: #fff;
    padding-left: 8px;
    padding-right: 8px;
  }
  > view + view {
    margin-top: 12px;
  }
  .cu-form-group {
    background: none;
  }
  .red-badge{
    display: inline-block;
    color: #d9001c;
  }
}
</style>
