<template>
  <el-dialog visible :close-on-click-modal="false" :before-close="closeDialog" :title="applyType == 2 ? $t('管理折扣') : $t('优惠申请')">
    <el-form ref="form" :model="form" label-width="80px" :rules="rules">
      <el-form-item :label="$t('商品类型')">
        <span>{{ $l(productType, 'title') }}</span>
      </el-form-item>
      <el-form-item :label="$t('商品名称')">
        <span>{{ orderItem.prodTitleZh }}</span>
      </el-form-item>
      <el-form-item :label="$t('英文名称')">
        <span>{{ orderItem.prodTitleEn }}</span>
      </el-form-item>
      <el-form-item :label="$t('线路')">
        【<dict-tag :type="DICT_TYPE.TRANSPORT_TYPE" :value="order.transportId" />】
        {{ channel ? $l(channel, 'title') : '' }}
        {{$t("从【{departureName}】发往【{objectiveName}】", {departureName: $l(order.logisticsInfoDto, 'startTitle'), objectiveName: $l(order.logisticsInfoDto, 'destTitle')})}}
      </el-form-item>
      <el-form-item :label="$t('是否预付')">
        <dict-tag :type="DICT_TYPE.ECW_YESNO" :value="orderItem.isPayAdvance" />
      </el-form-item>

      <el-row v-if="!orderItem.charging">
        <el-col :span="12">
          <el-form-item :label="$t('旧运费')">
            {{form.orgFreight}} {{ currentMap[form.freightCurrency] }} / {{ unitMap[form.freightVolume] }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('旧清关费')">
            {{form.orgClearanceFreight}} {{ currentMap[form.clearanceFreightCurrency] }} / {{ unitMap[form.clearanceFreightVolume] }}
          </el-form-item>
        </el-col>
      </el-row>
      <el-row v-if="!orderItem.charging">
        <el-col :span="12">
          <el-form-item :label="$t('新运费')" style="width: 400px" prop="freight">
            <el-input v-model="form.freight" type="number" class="w-100" />
            {{ currentMap[form.freightCurrency] }} / {{ unitMap[form.freightVolume] }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('新清关费')" style="width: 400px" prop="clearanceFreight">
            <el-input v-model="form.clearanceFreight" type="number" class="w-100" />
            {{ currentMap[form.clearanceFreightCurrency] }} / {{ unitMap[form.clearanceFreightVolume] }}
          </el-form-item>
        </el-col>
      </el-row>

      <el-form-item :label="$t('旧全包价')" v-if="orderItem.charging">
        {{form.orgFreight}} {{ currentMap[form.freightCurrency] }} / {{ unitMap[form.freightVolume] }}
      </el-form-item>
      <el-form-item :label="$t('新全包价')" style="width: 400px" prop="clearanceFreight"  v-if="orderItem.charging">
        <el-input v-model="form.freight" type="number" class="w-100" />
        {{ currentMap[form.freightCurrency] }} / {{ unitMap[form.freightVolume] }}
      </el-form-item>

    </el-form>
    <div class="page-title">审批流程</div>
    <work-flow xmlkey="special_apply" v-model="ccIdArr" />
    <div v-if="form.applyStatus != 1">
      <el-button type="primary" @click="handleSubmit" :disabled="!submitable">提交</el-button>
    </div>
    <div v-else>
      <el-button type="primary" @click="$router.push('/bpm/process-instance/detail?id=' + form.formId)">
        <dict-tag :type="DICT_TYPE.APPLY_STATUS" :value="form.applyStatus" />
      </el-button>
    </div>
  </el-dialog>
</template>

<script>
import {createOrderSpecial, getOrderSpecial} from "@/api/ecw/order"
import {getUnitList} from "@/api/ecw/unit"
import {getChannel, getChannelList} from "@/api/ecw/channel"
import { getCurrencyList } from '@/api/ecw/currency'
import { getProductType } from '@/api/ecw/productType'
import WorkFlow from '@/components/WorkFlow'
export default {
  name: "OrderSpecialDiscount",
  props: {
    order: Object,
    orderItem: Object,
    applyType:{ // // 1是优惠申请2是管理折扣3是佣金设置4是重货优惠5是泡货优惠， 默认是优惠申请，可以设置为2表示管理折扣，公用一个组件
      type: Number,
      default: 1
    }
  },
  components: {
    WorkFlow
  },
  created() {
    // 查看详情，列表进来的
    this.getOrderSpecial()

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

    getProductType(this.orderItem.prodType).then(res => {
      this.productType = res.data
    })
    if(this.order.channelId){
      getChannel(this.order.channelId).then(res => {
        this.channel = res.data
      })
    }
  },
  data() {
    return {
      // applyType: 1, // 1是优惠申请2是管理折扣3是佣金设置4是重货优惠5是泡货优惠
      unitList:[],
      // channelList:[],
      currencyList:[],
      // productTypeList:[],
      ccIdArr: [],
      form: { },
      rules:{
        seaFreight      : {required: true, message: '运费不能为空'},
        clearanceFreight: {required: true, message: '清关费不能为空'}
      },
      productType: null,
      channel: null
    }
  },
  watch:{
    ccIdArr(){
      this.$set(this.form, 'ccIds', this.ccIdArr.join(','))
    }
  },
  methods: {
    handleSubmit(){
      this.$refs.form.validate().then(res => {
        createOrderSpecial(Object.assign({}, this.form, {applyType: this.applyType})).then(res => {
          this.$message.success(this.$t('提交成功'))
          this.$emit('success')
        })
      })
    },
    getOrderSpecial(){
      getOrderSpecial(this.order.orderId, this.applyType, {orderItemId: this.orderItem.orderItemId}).then(r => {
        this.form = r.data
      })
    },
    /* getProductTypeNameById(id){
      return this.$l(this.productTypeList.find(e => e.id === id), 'title')
    }, */
    closeDialog(){
      this.$emit('close')
    }
  },
  computed: {
    // 是否可以提交
    submitable(){
      let submitable = false;
      [
        ['orgClearanceFreight', 'clearanceFreight'],
        ['orgFreight', 'freight']
      ].forEach(item => {
        if(this.form[item[0]] != this.form[item[1]]){
          submitable = true
        }
      })
      return submitable
    },
    // 根据渠道id显示渠道名
    getChannelNameById(){
      return channelId => {
        const s = this.channelList.find(item => item.channelId == channelId) ?. nameZh
        return s ? '【' + s + '】' : ''
      }
    },
    currentMap(){
      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>
