<template>
  <div class="app-container">
    <el-card>
      <div slot="header" class="card-title">{{$t('申请特价')}}</div>
      <!-- 列表 -->
      <div class="order-header">
        <span style="font-size: 15px;">{{$t('订单号')}}：{{ order.orderNo }}</span>
      </div>

      <el-table v-loading="loading" :data="order.orderItemVOList">
        <el-table-column :label="$t('序号')" align="center" prop="id" type="index"></el-table-column>
        <el-table-column
          prop="prodTitleZh"
          :label="$t('品名')">
          <template v-slot="{row}">
            {{ row.prodTitleZh }}/{{ row.prodTitleEn }}
          </template>
        </el-table-column>
        <el-table-column
          prop="prodAttrIds"
          :label="$t('填单货物属性')">
          <template v-slot="{row}">
            {{$t('品牌')}}：<dict-tag :type="DICT_TYPE.ECW_IS_BRAND" :value="row.brandType" /><br>
            {{$t('箱数')}}：{{ row.num }}<br>
            {{$t('体积')}}：{{ row.volume }}m³<br>
            {{$t('重量')}}：{{ row.weight }}Kg
          </template>
        </el-table-column>
        <el-table-column
          prop="address"
          :label="$t('入库货物属性')">
          <template v-slot="{row}">
            <!-- // TODO 缺少入库品牌信息 -->
            <template v-if="row.warehouseInInfoVO">
              {{$t('品牌')}}：<dict-tag :type="DICT_TYPE.ECW_IS_BRAND" :value="row.brandType" /><br>
              {{$t('箱数')}}：{{ row.warehouseInInfoVO.cartonsNum }}<br>
              {{$t('体积')}}：{{ row.warehouseInInfoVO.volume }}m³<br>
              {{$t('重量')}}：{{ row.warehouseInInfoVO.weight }}Kg
            </template>
            <span v-else>{{$t('暂时没有入库信息')}}</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="updateTime"
          :formatter="(_, __, v) => parseTime(v)"
          :label="$t('最后操作时间')">
        </el-table-column>
        
        <el-table-column
          :label="$t('原价')">
          <template v-slot="{row}">
            <template v-if="!row.originalSeaFreight">{{$t('未报价')}}</template>
            <template v-else-if="row.charging ==1">
              {{$t('全包价')}}：{{ row.originalSeaFreight }} {{ currencyMap[row.seaFreightCurrency] }}/{{ unitMap[row.seaFreightVolume] }}
            </template>
            <template v-else>
              {{$t('运费')}}：{{ row.originalSeaFreight }} {{ currencyMap[row.seaFreightCurrency] }}/{{ unitMap[row.seaFreightVolume] }}
              <br>
              {{$t('清关费')}}：{{ row.originalClearanceFreight }} {{ currencyMap[row.clearanceFreightCurrency] }}/{{ unitMap[row.clearanceFreightVolume] }}
            </template>
          </template>
        </el-table-column>
        <el-table-column
          label="成本价">
          <template v-slot="{row}">
            <template v-if="!row.costSeaFreight">{{$t('未报价')}}</template>
            <template v-else-if="row.charging">
              {{$t('全包价')}}：{{ row.costSeaFreight }} {{ currencyMap[row.seaFreightCurrency] }}/{{ unitMap[row.seaFreightVolume] }}
            </template>
            <template v-else>
              {{$t('运费')}}：{{ row.costSeaFreight }} {{ currencyMap[row.seaFreightCurrency] }}/{{ unitMap[row.seaFreightVolume] }}
              <br>
              {{$t('清关费')}}：{{ row.oneClearanceFreight }} {{ currencyMap[row.clearanceFreightCurrency] }}/{{ unitMap[row.clearanceFreightVolume] }}
            </template>
          </template>
        </el-table-column>
        <el-table-column
          :label="$t('销售价')">
          <template v-slot="{row}">
            <template v-if="!row.oneSeaFreight">{{$t('未报价')}}</template>
            <template v-else-if="row.charging">
              {{$t('全包价')}}：{{ row.oneSeaFreight }} {{ currencyMap[row.seaFreightCurrency] }}/{{ unitMap[row.seaFreightVolume] }}
            </template>
            <template v-else>
              {{$t('运费')}}：{{ row.oneSeaFreight }} {{ currencyMap[row.seaFreightCurrency] }}/{{ unitMap[row.seaFreightVolume] }}
              <br>
              {{$t('清关费')}}：{{ row.oneClearanceFreight }} {{ currencyMap[row.clearanceFreightCurrency] }}/{{ unitMap[row.clearanceFreightVolume] }}
            </template>
          </template>
        </el-table-column>

        <el-table-column
          prop="address"
          :label="$t('操作')">
          <template v-slot="{row}">
              <el-button size="mini" type="text" v-hasPermi="['ecw:order:update']" @click="showDiscountItem=row">{{$t('优惠申请')}}</el-button>
              <el-button size="mini" type="text" v-hasPermi="['ecw:order:update']" @click="showCommissionItem=row">{{$t('佣金规则')}}</el-button>
              <el-button size="mini" type="text" v-hasPermi="['ecw:order:update']" @click="showAllowanceItem=row">{{$t('管理折扣')}}</el-button>
          </template>
        </el-table-column>

      </el-table>

      <div class="mt-50 flex-center">
        <!--
          1.海运整柜、海运拼柜显示重货优惠  1,2
          2.空运专线、海空联运显示泡货优惠  3,4
         -->
        <el-button type="primary" @click="showPreferentialType=4" v-if="order.transportId === 1 || order.transportId === 2">{{$t('申请重货优惠')}}</el-button>
        <el-button type="primary" @click="showPreferentialType=5" v-else>{{$t('申请泡货优惠')}}</el-button>
        <el-button type="primary" @click="$tab.closePage()">{{$t('关闭窗口')}}</el-button>
      </div>
    </el-card>

    <!-- 优惠申请 -->
    <discount v-if="!!showDiscountItem" :order="order" :orderItem="showDiscountItem" @close="showDiscountItem=null" @success="onDiscountSuccess" />
    <!-- 管理折扣 -->
    <discount v-if="!!showAllowanceItem" :order="order" :orderItem="showAllowanceItem" @close="showAllowanceItem=null" :applyType="2" @success="onDiscountSuccess" />
    <!-- 佣金规则 -->
    <commission v-if="!!showCommissionItem" :order="order" :orderItem="showCommissionItem" @close="showCommissionItem=null" @success="onCommissionSuccess" />
    <!-- 重泡货优惠 -->
    <preferential v-if="!!showPreferentialType" :applyType="showPreferentialType" :order="order" @close="showPreferentialType=null" @success="onPreferentialSuccess" />
  </div>
</template>

<script>
import {DICT_TYPE, getDictDataLabel} from '@/utils/dict'
import {getUnitList} from "@/api/ecw/unit"
import {getCurrencyList} from "@/api/ecw/currency"
import {getProductAttrList} from "@/api/ecw/productAttr"
import { parseTime } from '@/utils/ruoyi'
import {getOrder} from "@/api/ecw/order"

import Discount from './Discount'
import Commission from './Commission'
import Preferential from './Preferential'
export default {
  name: "OrderSpecial",
  components: {
    Discount, Commission, Preferential
  },
  props: {
    orderId: [String, Number]
  },
  data() {
    return {
      parseTime,
      DICT_TYPE,
      getDictDataLabel,
      // 遮罩层
      loading: true,
      list: [],
      /* total:0,
      params:{
        page:1,
        rows:20,
        orderId:0,
        type:2
      }, */
      relationId:0,
      order: {
        number: '',
        orderItemVOList: []
      },
      unitList:[],
      currencyList:[],
      productAttrList:[],
      hasWarehouseInInfo: false,

      showDiscountItem: null, // 优惠申请
      showCommissionItem: null, // 佣金规则
      showAllowanceItem: null, // 管理折扣
      showPreferentialType: null, // 重泡货类型
    };
  },
  created() {
    this.getOrder()
    getUnitList().then(res => this.unitList = res.data)
    getCurrencyList().then(res => this.currencyList = res.data)
    getProductAttrList().then(res => this.productAttrList = res.data)
  },
  methods: {
    getOrder(){
      this.loading = true
      getOrder(this.orderId).then(response => {
        this.loading = false
        this.order = response.data
        this.order.orderItemVOList.forEach(e => {
          if (e.warehouseInInfoVO){
            this.hasWarehouseInInfo = true
          }
        })
      })
    },
    toweight(){
      this.$router.push({
        path:"/order/specialWeight/"+this.params.orderId,
      })
    },
    tolight(){
      this.$router.push({
        path:"/order/specialLight/"+this.params.orderId,
      })
    },
    onDiscountSuccess(){
      this.showDiscountItem = null
      this.getOrder()
    },
    onCommissionSuccess(){
      this.showCommissionItem = null
      this.getOrder()
    },
    onPreferentialSuccess(){
      this.showPreferentialType = null
      this.getOrder()
    }
  },
  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
    }
  }

};
</script>
<style scoped>
.card-title{
  font-size: 18px;
  font-weight: bold;
}
.order-header{
  padding-bottom: 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
</style>