<template>
  <el-descriptions border :column="3" v-if="offer">
    <el-descriptions-item label="报价单号">{{offer.number}}</el-descriptions-item>
    <el-descriptions-item label="运输方式">
        <dict-tag :type="DICT_TYPE.TRANSPORT_TYPE" :value="offer.transportId" />
    </el-descriptions-item>
    <el-descriptions-item label="出货方式">
        {{ channel ? $l(channel, 'name') : '/' }}
    </el-descriptions-item>
    <el-descriptions-item label="报价单状态">
        <dict-tag :type="DICT_TYPE.ECW_OFFER_STATUS" :value="offer.status" />
    </el-descriptions-item>
    <el-descriptions-item label="唛头">{{offer.marks}}</el-descriptions-item>
    <el-descriptions-item label="始发仓">{{form.departureName}}</el-descriptions-item>
    <el-descriptions-item label="目的仓">{{form.objectiveName}}</el-descriptions-item>
    <el-descriptions-item label="申请原因" :span="3" v-if="type == 2">
      <div class="item">
        商品：{{$l(form, 'prodTitle')}}
      </div>
      <div class="item">
        佣金规则：{{$t('从【{oldType}】改为【{newType}】', {
          oldType: getDictDataLabel(DICT_TYPE.COMMISSION_TYPE, offer.commissionType) ,
          newType: getDictDataLabel(DICT_TYPE.COMMISSION_TYPE, form.commissionType),
        })}}
      </div>
      
      <div>
        原运费：{{form.seaFreight + currencyMap[form.orgSeaFreightCurrency] + '/' + unitMap[form.orgSeaFreightVolume]}}
      </div>
      <div>
        新运费：{{newSeaFreight + currencyMap[form.orgSeaFreightCurrency] + '/' + unitMap[form.orgSeaFreightVolume]}}
      </div>
      <div>
        成本价：{{form.orgSeaFreight + currencyMap[form.orgSeaFreightCurrency] + '/' + unitMap[form.orgSeaFreightVolume]}}
      </div>
      <div>
        明佣：{{ form.lightCommissionAmount + currencyMap[form.orgSeaFreightCurrency] + '/' + unitMap[form.orgSeaFreightVolume]}}
      </div>
      <div>
        暗佣：{{form.shadeCommissionAmount + currencyMap[form.orgSeaFreightCurrency] + '/' + unitMap[form.orgSeaFreightVolume]}}
      </div>
    </el-descriptions-item>

    <el-descriptions-item label="申请原因" :span="3" v-if="type == 1">
      <div class="item">
        商品：{{$l(form, 'prodTitle')}}
      </div>
      <template v-if="form.charging">
        原全包价：{{form.orgSeaFreight}} {{currencyMap[form.seaFreightCurrency]}} / {{unitMap[form.seaFreightVolume]}}, 
        新全包价：{{form.seaFreight}} {{currencyMap[form.seaFreightCurrency]}} / {{unitMap[form.seaFreightVolume]}}
      </template>
      <template v-else>
        <div>
          原运费：{{form.orgSeaFreight}} {{ currencyMap[form.seaFreightCurrency]}} /{{unitMap[form.seaFreightVolume]}}，
          原清关费：{{form.orgClearanceFreight}} {{currencyMap[form.clearanceFreightCurrency]}} / {{unitMap[form.clearanceFreightVolume]}}
        </div>
        <div>
          新运费：{{form.seaFreight}} {{currencyMap[form.seaFreightCurrency]}} / {{unitMap[form.seaFreightVolume]}}，
          新清关费：{{form.clearanceFreight}} {{currencyMap[form.clearanceFreightCurrency]}} / {{unitMap[form.clearanceFreightVolume]}}
        </div>
      </template>
    </el-descriptions-item>
    <!-- 
    
    <el-descriptions-item label="商品类型">{{ $l(productType, 'title') }}</el-descriptions-item>
    <el-descriptions-item label="商品名称">{{ form.prodTitleZh }}</el-descriptions-item>
    <el-descriptions-item label="英文名称">{{ form.prodTitleEn }}</el-descriptions-item>
    <el-descriptions-item label="线路">
      【<dict-tag :type="DICT_TYPE.TRANSPORT_TYPE" :value="form.transportId" />】
      <template v-if="channel">
        【{{ $l(channel, 'name') }}】
        
      </template>
      {{$t("从【{start}】发往【{dest}】", { start: form.departureName, dest: form.objectiveName })}}
    </el-descriptions-item>
    <el-descriptions-item label="是否预付">
      <dict-tag :type="DICT_TYPE.ECW_PAY_ADVANCE" :value="form.isPayAdvance" />
    </el-descriptions-item> -->
    <!-- <el-descriptions-item label="旧运费">{{ form.orgSeaFreight }} {{ currencyMap[form.orgSeaFreightCurrency] }}/{{ unitMap[form.orgSeaFreightVolume] }}</el-descriptions-item>
    <el-descriptions-item label="旧清关费">{{ form.orgClearanceFreight }} {{ currencyMap[form.orgClearanceFreightCurrency] }}/{{ unitMap[form.orgClearanceFreightVolume] }}</el-descriptions-item>
    <el-descriptions-item label="新运费">{{ form.seaFreight }} {{ currencyMap[form.seaFreightCurrency] }}/{{ unitMap[form.seaFreightVolume] }}</el-descriptions-item>
    <el-descriptions-item label="新清关费">{{ form.clearanceFreight }} {{ currencyMap[form.clearanceFreightCurrency] }}/{{ unitMap[form.clearanceFreightVolume] }}</el-descriptions-item> -->
  </el-descriptions>
</template>

<script>
import {getOfferSpecialByApproveId, getOffer} from "@/api/ecw/offer"
import {getUnitList} from "@/api/ecw/unit"
import {getChannel} from "@/api/ecw/channel"
import { getCurrencyList } from '@/api/ecw/currency'
import {getProductType} from '@/api/ecw/productType'
import Decimal from 'decimal.js'
export default {
  name: "SpecialDetail",
  props: {
    id: [String, Number],
    type: Number, // 类型，1特价，2佣金
  },
  created() {
    // 从流程查看详情
    if(this.id)
      this.getOfferSpecialByApproveId()

    getUnitList().then(res => this.unitList = res.data)
    getCurrencyList().then(res => this.currencyList = res.data)

  },
  data() {
    return {
      unitList:[],
      channelList:[],
      currencyList:[],
      productType: null,
      channel: null,
      offer: null,
      form:{}
    }
  },
  computed: {
    currencyMap(){
      let map = {}
      this.currencyList.forEach(item => {
        map[item.id] = this.$l(item, 'title')
      })
      return map
    },
    unitMap(){
      let map = {}
      this.unitList.forEach(item => {
        map[item.id] = this.$l(item, 'title')
      })
      return map
    },
    // 新运费
    newSeaFreight(){
      return Decimal(this.form.seaFreight).plus(this.form.shadeCommissionAmount).plus(this.form.lightCommissionAmount)
    }
  },
  methods: {
    getOfferSpecialByApproveId(){
      getOfferSpecialByApproveId(this.id).then(r => {
        this.form = r.data
        getOffer(this.form.offerId).then(res => {
          this.offer = res.data
        })
        if(this.form.productType){
          getProductType(this.form.productType).then(res => {
            this.productType = res.data
          })
        }
        if(this.form.channelId){
          getChannel(this.form.channelId).then(res => {
            this.channel = res.data
          })
        }
      })
    }
  },
  
}
</script>