<template>
  <div class="app-container">

    <el-form ref="form" :model="form" :rules="rules" label-width="120px">
        <el-card>
            <div slot="header" class="card-title">新建订单</div>

            <el-descriptions :column="3" border>
                <el-descriptions-item label="*发货人" >
                    <el-form-item label="" label-width="0" style="margin-bottom: 0" prop="consignorId" required error="发货人不能为空">
                        <customer-selector v-model="form.consignorId" @change="consignor = $event" />
                    </el-form-item>
                </el-descriptions-item>
                <el-descriptions-item label="发货人">
                    {{consignor.name || '无'}}
                </el-descriptions-item>
                <el-descriptions-item label="手机号">
                    {{consignor.defaultContactPhone || '无'}}
                </el-descriptions-item>
                <el-descriptions-item label="发货人公司">
                    {{consignor.company || '无'}}
                </el-descriptions-item>
                <el-descriptions-item label="客户来源">
                    {{consignor.source || '无'}}
                </el-descriptions-item>
                <el-descriptions-item label="社交软件">
                    暂缺字段数据
                </el-descriptions-item>
                <el-descriptions-item label="联系地址">
                    {{consignor.address || '无'}}
                </el-descriptions-item>
            </el-descriptions>
            <el-descriptions :column="3" border>
                <el-descriptions-item label="*收货人">
                    
                    <el-form-item label="" label-width="0" style="margin-bottom: 0" prop="consigneeId" required error="收货人不能为空">
                        <customer-selector v-model="form.consigneeId" @change="consignee = $event" />
                    </el-form-item>
                </el-descriptions-item>
                <el-descriptions-item label="收货人">
                    {{consignee.name || '无'}}
                </el-descriptions-item>
                <el-descriptions-item label="手机号">
                    {{consignee.defaultContactPhone || '无'}}
                </el-descriptions-item>
                <el-descriptions-item label="收货人公司">
                    {{consignee.company || '无'}}
                </el-descriptions-item>
                <el-descriptions-item label="客户来源">
                    {{consignee.source || '无'}}
                </el-descriptions-item>
                <el-descriptions-item label="社交软件">
                    暂缺字段数据
                </el-descriptions-item>
                <el-descriptions-item label="联系地址">
                    {{consignee.address || '无'}}
                </el-descriptions-item>
            </el-descriptions>
            
            <el-descriptions :column="3" border>
                <el-descriptions-item label="*始发城市">
                    <el-form-item label="" label-width="0" style="margin-bottom: 0" prop="departureId" required error="始发地必选">
                        <el-select v-model="form.departureId" placeholder="请选择始发地">
                            <el-option v-for="item in expoerCityList" :label="item.titleZh" :value="item.id" :key="item.id"></el-option>
                        </el-select>
                    </el-form-item>
                </el-descriptions-item>
                <el-descriptions-item label="*目的城市">
                    <el-form-item label="" label-width="0" style="margin-bottom: 0" prop="objectiveId" required error="目的城市必选">
                        <el-select v-model="form.objectiveId" placeholder="请选择目的地">
                        <el-option v-for="item in importCityList" :label="item.titleZh" :value="item.id" :key="item.id"></el-option>
                        </el-select>
                    </el-form-item>
                </el-descriptions-item>
            </el-descriptions>
        </el-card>
        <el-card  class="mt-10">
            <div slot="header" class="card-title">
                <div class="card-name">商品信息</div>
                <el-button type="primary" size="mini" icon="el-icon-plus" @click="addProduct"></el-button>
            </div>
            <el-table :data="productList" border>
              <el-table-column label="序号" width="60px" fixed>
                <template slot-scope="scope">
                    {{scope.$index + 1}}
                </template>
              </el-table-column>
              <el-table-column label="中文名" width="160px">
                <template slot-scope="{row}">
                    <product-selector v-model="row.prodId" @change="row.goodsType = $event.typeId" />
                </template>
              </el-table-column>
              <el-table-column label="英文名" width="160px">
                <template slot-scope="{row}">
                    <product-selector v-model="row.prodId" @change="row.goodsType = $event.typeId" />
                </template>
              </el-table-column>
              <el-table-column label="商品类型" width="160px">
                <template slot-scope="{row}">
                    <selector disabled v-model="row.goodsType" :options="productAttrList" label-field="attrName" value-field="id"></selector>
                </template>
              </el-table-column>

              <el-table-column label="品牌" width="100px">
                <template slot-scope="{row}">
                    <dict-selector v-model="row.brand" :type="DICT_TYPE.ECW_IS_BRAND" formatter="bool" defaultable @input="getProductFee(row)" />
                </template>
              </el-table-column>
              <el-table-column label="件数" width="90px">
                <template slot-scope="{row}">
                    <el-input v-model.number="row.num" />
                </template>
              </el-table-column>
              <el-table-column label="包装单位">
                <template slot-scope="{row}">
                    <dict-selector v-model="row.unit" :type="DICT_TYPE.ECW_PACKAGE_TYPE" defaultable />
                </template>
              </el-table-column>
              <el-table-column label="箱规(m)" width="120px">
                <template slot-scope="{row}">
                    <el-input v-model="row.boxGauge" @input="calcVolume(row)" />
                </template>
              </el-table-column>
              <el-table-column label="总体积(m³)" width="100px">
                <template slot-scope="{row}">
                    <el-input v-model="row.volume" />
                </template>
              </el-table-column>
              <el-table-column label="总重量(kg)" width="100px">
                <template slot-scope="{row}">
                    <el-input v-model="row.weight" />
                </template>
              </el-table-column>
              <el-table-column label="货值(RMB)" width="100px">
                <template slot-scope="{row}">
                    <el-input v-model="row.worth" />
                </template>
              </el-table-column>
              <el-table-column label="商品特性" width="250px">
                <template slot-scope="{row}">
                    <el-checkbox-group v-model="row.prodAttrArr" @change="onProductAttrChange(row, $event)">
                      <el-checkbox v-for="item in productAttrList" :label="item.id" :key="item.id">{{item.attrName}}</el-checkbox>
                    </el-checkbox-group>
                </template>
              </el-table-column>
              <el-table-column label="运输方式" width="150px">
                <template slot-scope="{row}">
                    <dict-selector :type="DICT_TYPE.ECW_TRANSPORT_TYPE" v-model="row.transportId"
                    @input="onTransportChange(row,$event)" formatter="number" />
                </template>
              </el-table-column>
              <el-table-column label="出货渠道" width="150px">
                <template slot-scope="{row}">
                    <selector
                    :disabled="getDictData(DICT_TYPE.ECW_TRANSPORT_TYPE, row.transportId).cssClass != 'channel'"
                    v-model="row.channelId"
                    :options="channelList"
                    value-field="channelId"
                    label-field="nameZh"
                    @input="onChannelChange(row)"
                    ></selector>
                </template>
              </el-table-column>
              <el-table-column label="线路" width="200px">
                <template slot-scope="{row}">
                    <selector
                    v-model="row.lineId"
                    :options="routerList"
                    @input="onLineChange(row)"
                    clearable
                    :label-field="(item, index) => item.startTitleZh + ' >> ' + item.destTitleZh" value-field="id"></selector>
                </template>
              </el-table-column>
              <el-table-column label="运费" width="200px">
                <template slot-scope="{row}">
                    <template v-if="row.fee">
                        <div>
                            运费：{{row.fee.seaFreight}} {{currentMap[row.fee.seaFreightCurrency]}} / {{unitMap[row.fee.seaFreightVolume]}}
                        </div>
                        <div>
                            清关费：{{row.fee.clearanceFreight}} {{currentMap[row.fee.clearanceFreightCurrency]}} / {{unitMap[row.fee.clearanceFreightVolume]}}
                        </div>
                    </template>
                </template>
              </el-table-column>
              <el-table-column label="操作" width="180px" fixed="right">
                <template slot-scope="scope">
                    <el-button size="mini" type="danger" @click="delProduct(scope.$index)">删除</el-button>
                    <!-- <el-button size="mini" type="primary" @click="showMorePrice($index)">更多报价</el-button> -->
                    <!-- <el-button size="mini" type="primary" @click="getProductFee(scope.row)">计算</el-button> -->
                </template>
              </el-table-column>
            </el-table>
            <!-- 
        </el-card>
        <el-card  class="mt-10"> -->
            <div class="card-title" style="padding:20px 0;">费用小计</div>
            <el-descriptions :column="4" border>
                <el-descriptions-item label="总件数">
                    {{sum.totalNum || 0}}
                </el-descriptions-item>
                <!-- <el-descriptions-item label="总体积">
                    {{sum.totalVolume || 0}}m³
                </el-descriptions-item>
                <el-descriptions-item label="总重量">
                    {{sum.totalWeight || 0}}kg
                </el-descriptions-item> -->
                <el-descriptions-item label="总货值">
                    {{sum.totalWorth || 0}}人民币
                </el-descriptions-item>
                <el-descriptions-item label="保价费">
                    {{fee.insuranceFee || 0}}人民币
                </el-descriptions-item>
                <!-- <el-descriptions-item label="总运费">
                    <div>{{fee.seaNGN || 0}}泰拉</div>
                    <div>{{fee.seaRMB || 0}}人民币</div>
                    <div>{{fee.seaUSD || 0}}美元</div>
                </el-descriptions-item>
                <el-descriptions-item label="总清关费">
                    <div>{{fee.clearanceNGN || 0}}泰拉</div>
                    <div>{{fee.clearanceRMB || 0}}人民币</div>
                    <div>{{fee.clearanceUSD || 0}}美元</div>
                </el-descriptions-item>
                <el-descriptions-item label="预计费用">
                    <div>{{fee.seaNGN + fee.clearanceNGN}}泰拉</div>
                    <div>{{fee.seaRMB + fee.clearanceRMB + fee.insuranceFee	}}人民币</div>
                    <div>{{fee.seaUSD + fee.clearanceUSD}}美元</div>
                </el-descriptions-item> -->
            </el-descriptions>
        </el-card>
        <template v-for="(item, index) in transportList" >
            <el-card  class="mt-10" :key="index" v-if="item._enabled" :data-enabled="item._enabled">
                <div class="card-title" slot="header">{{item.label}}</div>

                <el-form-item v-for="(router, routerIndex) in item.routers" :key="routerIndex" :label="item.label.substr(0, 2) + '线路' + (routerIndex + 1)">
                    <el-col :span="12">
                        {{getRouterNameById(router.lineId)}}
                    </el-col>
                    <el-col :span="12" v-if="router.channelId">
                        出货渠道{{routerIndex + 1}}: {{getChannelNameById(router.channelId)}}
                    </el-col>
                </el-form-item>
                <el-form-item label="是否双清" v-if="[2,3,4].indexOf(+item.transportId) > -1">
                    <dict-selector v-model="item.doubleClear" form-type="radio" :type="DICT_TYPE.ECW_DOUBLE_CLEAR" />
                </el-form-item>
                <el-form-item label="航空公司" v-if="[3,4].indexOf(+item.transportId) > -1">
                    <el-select placeholder="" v-model="item.airlineCompany">
                    </el-select>
                </el-form-item>
                
                <el-form-item label="船公司" v-if="[2].indexOf(+item.transportId) > -1">
                    <el-select placeholder="" v-model="item.airlineCompany">
                    </el-select>
                </el-form-item>
                <el-form-item label="清关证书" v-if="[2,3,4].indexOf(+item.transportId) > -1">
                    <dict-selector v-model="item.customsClearCert"  form-type="radio" :type="DICT_TYPE.INFRA_BOOLEAN_STRING" fomatter="bool" />
                </el-form-item>
                <el-form-item label="清关证书备注" v-if="[2,3,4].indexOf(+item.transportId) > -1">
                    <el-input v-model="item.remarks" ></el-input>
                </el-form-item>
                <el-form-item label="是否拆包" v-if="[3,4].indexOf(+item.transportId) > -1">
                    <dict-selector v-model="item.isUnpack"  form-type="radio" :type="DICT_TYPE.INFRA_BOOLEAN_STRING" fomatter="bool" />
                </el-form-item>
                <el-form-item label="单票立刻转运" v-if="[3,4].indexOf(+item.transportId) > -1">
                    <dict-selector v-model="item.isSingleTicketTransport"  form-type="radio" :type="DICT_TYPE.INFRA_BOOLEAN_STRING" fomatter="bool" />
                    <span style="margin-left:10px">注：若只有一件，货到仓库立即发，选“是”，多件需仓库集运待发，选“否”</span>
                </el-form-item>
                <el-form-item label="包装类型" v-if="[3,4].indexOf(+item.transportId) > -1">
                    <dict-selector v-model="item.packageType" form-type="checkbox" :type="DICT_TYPE.ECW_PACKAGE_TYPE" multiple />
                </el-form-item>
                <el-form-item label="包装要求备注" v-if="[3,4].indexOf(+item.transportId) > -1">
                    <el-input v-model="item.packageRemarks"  ></el-input>
                </el-form-item>
            </el-card>
        </template>
        <el-card class="mt-10">
            <div class="card-title" slot="header">通用</div>
            
            <el-descriptions :column="2" border>
                <el-descriptions-item label="唛头">
                    <el-input v-model="form.marks" placeholder=""></el-input>
                </el-descriptions-item>
                <el-descriptions-item label="报关方式">
                    <dict-selector :type="DICT_TYPE.ECW_CUSTOMS_TYPE" v-model="form.customsType" form-type="radio" />
                </el-descriptions-item>
                <el-descriptions-item label="预计结束时间">
                    <el-date-picker v-model="form.stopTime" value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
                </el-descriptions-item>
                <el-descriptions-item label="是否控货">
                    <dict-selector :type="DICT_TYPE.INFRA_BOOLEAN_STRING" formatter="bool" v-model="form.control" form-type="radio" />
                </el-descriptions-item>
                <el-descriptions-item label="竞争对手">
                    <el-input v-model="form.competitor" placeholder=""></el-input>
                </el-descriptions-item>
                <el-descriptions-item label="重要程度">
                    <el-rate v-model="form.importance"></el-rate>
                </el-descriptions-item>
                <el-descriptions-item label="价格有效时间">
                    <el-date-picker v-model="form.startTime" placeholder="" value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
                    -
                    <el-date-picker v-model="form.endTime" placeholder="" value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
                </el-descriptions-item>
                <el-descriptions-item label="交货方式">
                    <!--
                        接口要求数据为整数，所以增加trade_type类型的字典，用1234代码以下不同类型
                        FOB(离岸价)，CIF(到岸价)，CNF(成本加运费)，EXW(出厂价)
                    -->
                    <dict-selector :type="DICT_TYPE.ECW_TRADE_TYPE" fomtter="number" v-model="form.tradeType" />
                    <el-input v-model="form.tradeAdress" placeholder=""></el-input>
                </el-descriptions-item>
                <!-- <el-descriptions-item label="总运费" :span="2">
                    
                </el-descriptions-item>
                <el-descriptions-item label="总清关费" :span="2">
                    
                </el-descriptions-item>
                <el-descriptions-item label="总价格" :span="2">
                    
                </el-descriptions-item> -->
                <!-- <el-descriptions-item label="佣金类型" :span="2">
                    <dict-selector :type="DICT_TYPE.COMMISSION_TYPE" form-type="radio" fomtter="number" v-model="form.commissionType" defaultable />
                </el-descriptions-item> -->
                <el-descriptions-item label="付款人" :span="2">
                     <dict-selector :type="DICT_TYPE.DRAWEE" v-model="form.drawee" form-type="radio" />
                </el-descriptions-item>
                <el-descriptions-item v-if="form.drawee==3" label="费用类型" :span="2">
                    <template v-for="(item,index) in customDraweeVOList" v-key="index">
                      <el-form-item :label="item.name" >
                        <dict-selector :type="DICT_TYPE.DRAWEE" :filter="(e) => e.value == '1' || e.value == '2'" v-model="item.value" form-type="radio" />
                      </el-form-item>
                    </template>
                </el-descriptions-item>
            </el-descriptions>
        </el-card>

        <el-form-item label="">
            <el-button type="primary" @click="submitForm">确 定</el-button>
            <el-button @click="$router.back()">取 消</el-button>
        </el-form-item>
      </el-form>
  </div>
</template>

<script>
import { createOrder, updateOrder, getOrder, getProductFeeList, getProductFee } from "@/api/ecw/order";
import ProductSelector from '@/components/ProductSelector'
import {getProductAttrList} from '@/api/ecw/productAttr'
import {getChannelList} from '@/api/ecw/channel'
import Selector from '@/components/Selector'
import CustomerSelector from '@/components/CustomerSelector'
import {openedRouterList as getOpenedRouterList} from '@/api/ecw/warehouse'
import {getTradeCityList} from '@/api/ecw/region'
import {getDictData} from  '@/utils/dict'
import Fee from '@/components/Fee'
import {getCurrencyList} from '@/api/ecw/currency'
import {getUnitList} from '@/api/ecw/unit'
import { getDictDatas } from '@/utils/dict';
export default {
  name: "OrderEdit",
  components: {
    ProductSelector, Selector, CustomerSelector, Fee
  },
  data() {
    return {
      customDraweeVOList: [
        {name: '运费',value: undefined},
        {name: '清关费',value: undefined},
        {name: '其他费用',value: undefined},
        {name: '报关费',value: undefined}
      ],
      draweeList: [],
      // 遮罩层
      loading: true,
      // 是否显示弹出层
      /* dateRangeStopTime: [],
      dateRangeStartTime: [],
      dateRangeEndTime: [],
      dateRangeCreateTime: [], */
      productList:[], // 商品信息
      productAttrList:[],  // 商品属性
      channelList: [], // 出货取到
      routerList: [],
      tradeCityList: [],
      consignor: {}, // 发货人
      consignee:{}, // 收货人
      transportList: [],
      currencyList:[],
      unitList:[],
      fee: {}, // 费用
      // 表单参数
      form: {
        sendstatus:0
      },
      // 表单校验
      rules: {
        /* number: [{ required: true, message: "报价单号不能为空", trigger: "blur" }],
        consignorId: [{ required: true, message: "客户id，发货人不能为空", trigger: "blur" }],
        consigneeId: [{ required: true, message: "收货人id不能为空", trigger: "blur" }],
        sendstatus: [{ required: true, message: "站内信状态，0未发送，1已发送不能为空", trigger: "blur" }], */
      }
    };
  },
  computed:{
    expoerCityList(){
        return this.tradeCityList.filter(item => item.type == 2)
    },
    importCityList(){
        return this.tradeCityList.filter(item => item.type == 1)
    },
    getDictData(){
        return (type, value) => getDictData(type, value) || {}
    },
    // 被启用的货运方式
    /* enbedTransports(){
        let transports = []
        this.transportList.forEach(item => {
            let disabled = true
            let lineIds = []
            let channelIds = []
            let routers = []
            this.productList.forEach(prod => {
                if(prod.offerTransportId == item.transportId){
                    disabled = false
                    routers.push({
                        lineId: prod.lineId,
                        channelId: prod.channelId
                    })
                    if(prod.lineId)lineIds.push(prod.lineId)
                    if(prod.channelId)channelIds.push(prod.channelId)
                }
            })
            if(!disabled){
                item._disabled = disabled
                item.routers = routers
                item.lineIds = lineIds.join(',')
                item.channelIds = channelIds.join(',')
                transports.push(item)
            }
        })
        return transports
    }, */
    // 根据线路id显示线路名称
    getRouterNameById(){
        return routerId => {
            let router = this.routerList.find(item => item.id == routerId)
            console.log({router})
            if(router){
                return router.startTitleZh + ' > ' + router.destTitleZh
            }
            return '-'
        }
    },
    // 根据渠道id显示渠道名
    getChannelNameById(){
        return channelId => {
            return this.channelList.find(item => item.channelId == channelId) ?. nameZh
        }
    },
    currentMap(){
        let map = {}
        this.currencyList.forEach(item => {
            map[item.id] = item.titleZh
        })
        return map
    },
    unitMap(){
        let map = {}
        this.unitList.forEach(item => {
            map[item.id] = item.titleZh
        })
        return map
    },
    sum(){
        let sum = {
            totalNum: 0,
            totalVolume: 0,
            totalWeight: 0,
            totalWorth: 0,
        }
        this.productList.forEach(item => {
            sum.totalNum += parseInt(item.num) || 0
            sum.totalVolume += parseFloat(item.volume) || 0
            sum.totalWeight += parseFloat(item.weight) || 0
            sum.totalWorth += parseFloat(item.worth) || 0

        })
        return sum
    }
  },
  watch:{
    // 始发地
    'form.departureId'(){
        this.getOpenedRouterList()
    },
    // 目的地
    'form.objectiveId'(){
        this.getOpenedRouterList()
    },
  },
  created() {
    getProductAttrList().then(res => this.productAttrList = res.data)
    getChannelList().then(res => this.channelList = res.data)
    getTradeCityList().then(res => this.tradeCityList = res.data)
    getCurrencyList().then(res => this.currencyList = res.data)
    getUnitList().then(res => this.unitList = res.data)
    this.getDictDatas(this.DICT_TYPE.ECW_TRANSPORT_TYPE).forEach(res => {
        this.transportList.push({
            transportId: +res.value, // 转为整形
            label: res.label,
        })
    })

    if(this.$route.query.id){
        getOffer(this.$route.query.id).then(res => {
            this.$set(this, 'form', res.data)
            if(res.data.offerProdRespVOList){
                res.data.offerProdRespVOList.forEach(item => {
                    this.addProduct({
                        "goodsType": item.goodsType,
                        "brand": item.brand,
                        "unit": item.unit,
                        "channelId": item.channelId,
                        "lineId": item.lineId,
                        "prodId": item.prodId,
                        "num": item.num,
                        "boxGauge": item.boxGauge,
                        "volume": item.volume,
                        "transportId": item.transportId,
                        "weight": item.weight,
                        "worth": item.worth,
                        "prodAttrArr": item.prodAttrIds && item.prodAttrIds != '' ? item.prodAttrIds.split(',').filter(item => item != '').map(item => +item) : []
                    })
                })
            }
            console.log('res.data.transportRespVOList', res.data.transportRespVOList)
            res.data.transportRespVOList.forEach(item => {
                let transport = this.transportList.find(t => t.transportId ==  item.transportId)
                console.log(item.transportId, transport)
                Object.assign(transport, item, {_enabled: true})
            })
            this.$nextTick(() => {
                this.updateEnabledTransports()
            })
        })
    }else this.addProduct()
  },
  methods: {
    onTransportChange(row, val){
        this.getProductFee(row)
        if(this.getDictData(this.DICT_TYPE.ECW_TRANSPORT_TYPE, val).cssClass != 'channel') row.channelId = null
        this.updateEnabledTransports()
    },
    onLineChange(row){
        this.getProductFee(row)
        this.updateEnabledTransports()
    },
    onChannelChange(row){
        this.getProductFee(row)
    },
    onProductAttrChange(row, attr){
        console.log(attr)
        this.getProductFee(row)
        /* // 需要强制刷新，否则勾选框不更新
        this.$forceUpdate() */
    },
    // 更新运输方式
    updateEnabledTransports(){
        
        let enabled = {}
        this.productList.forEach(prod => {
            if(prod.transportId){
                if(!enabled[prod.transportId]){
                    enabled[prod.transportId] = {
                        // transportId: prod.transportId,
                        lineIdSet: new Set(),
                        channelIdSet: new Set(),
                        routers:[]
                    }
                }
                if(prod.lineId){
                    enabled[prod.transportId].lineIdSet.add(prod.lineId)
                }
                if(prod.channelId){
                    enabled[prod.transportId].channelIdSet.add(prod.channelId)
                }
                if(prod.lineId && enabled[prod.transportId].routers.findIndex(item => { item.lineId == prod.lineId && item.channelId == prod.channelId }) < 0){
                    enabled[prod.transportId].routers.push({
                        lineId: prod.lineId,
                        channelId: prod.channelId
                    })
                }
            }
        })
        console.log(JSON.stringify(enabled))
        let enabledTransportIds = Object.keys(enabled).map(item => +item)
        this.transportList.forEach(transport => {
            this.$set(transport, '_enabled', enabledTransportIds.indexOf(transport.transportId) > -1 && enabled[transport.transportId].routers.length)
            if(transport._enabled){
                Object.assign(transport, enabled[transport.transportId])
            }
        })
    },
    addProduct(data){
        this.productList.push(data || {prodAttrArr:[]})
    },
    // 计算商品运费
    getProductFee(row){
        if(!row.prodId || !row.transportId || !row.lineId || !row.num || !row.weight)return false
        if(row.prodAttrArr){
            row.prodAttrIds = row.prodAttrArr.join(',')
        }
        getProductFeeList(row).then(res => {
            this.$set(row, 'fee', res.data[0] || {})
        })
    },
    // 获取路线
    getOpenedRouterList(){
        let params = {}
        if(this.form.departureId){
            params.startCityId = this.form.departureId
        }
        if(this.form.objectiveId){
            params.destCityId = this.form.objectiveId
        }
        getOpenedRouterList(params).then(res => this.routerList = res.data)
    },
    // 计算体积
    calcVolume(row){
        if(!row.boxGauge || !row.num) return false
        try{
            row.volume = (eval(row.boxGauge) * row.num).toFixed(2)
        }catch(e){
            row.volume = ''
        }
    },
    // 删除一条产品
    delProduct(index){
        this.$confirm('确定删除此条内容么？')
            .then(res => {
                this.productList.splice(index, 1)
            })
    },
    // 显示更多报价
    showMorePrice(index){
        console.log('显示更多', index)
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (!valid) {
          return;
        }
        
        this.productList.map(item => {
            item.prodAttrIds = item.prodAttrArr.join(',')
        })
        this.transportList.map(item => {
            if(item._enabled){
                item.lineIds = Array.from(item.lineIdSet).join(',')
                item.channelIds = Array.from(item.channelIdSet).join(',')
            }
        })
        // 修改的提交
        if (this.form.orderNo != null) {
            let data = Object.assign({}, this.form, {
              customDraweeVOList: this.customDraweeVOList,
              transportUpdateReqVOList: this.transportList.filter(item => item._enabled),
              orderItemVOList: this.productList
            })
            updateOrder(data).then(response => {
                this.$modal.msgSuccess("修改成功");
                this.$router.back()
            });
            return;
        }
        let data = Object.assign({}, this.form, {
            customDraweeVOList: this.customDraweeVOList,
            transportUpdateReqVOList: this.transportList.filter(item => item._enabled),
            orderItemVOList: this.productList
        })
        // 添加的提交
        createOrder(data).then(response => {
          this.$modal.msgSuccess("新增成功");
          this.$router.replace('order')
        });
      });
    },
    
  }
};
</script>
<style lang="scss" scoped>
.card-title{
    font-size: 18px;
    display: flex;
    .card-name{
        flex: 1;
    }
}
.mt-10{
    margin-top: 10px;
}
</style>