yf-admin-ui/src/views/iosBasicData/OceanFreightImport/bills/assembly/formbottom.vue

<template>
  <div>
    <el-form :model="assemblyForm" ref="form" label-width="90px" :disabled="disabled">
      <el-row>
        <!-- <el-col :span="6">
                    <el-form-item label="业务类型" prop="businessTypes">
                        <span slot="label">
                            <span style="color: #1e9fff">业务类型</span>
                        </span>
                        <search-query :datalist="businessTypesData" :selectValue="assemblyForm.businessTypes" :forParameter="{ key: 'dictKey', label: 'dictValue', value: 'dictKey', }"
                            :filterable="true" :clearable="true" :remote="true" :disabled="detailData.seeDisabled" :buttonIf="false"
                            placeholder="请选择业务类型" @corpChange="corpChange($event, 'businessTypes')">
                        </search-query>
                    </el-form-item>
                </el-col> -->
        <!-- <el-col :span="6">
                    <el-form-item label="截单时间" prop="cyTrailerTime">
                        <span slot="label">
                            <span style="color: #1e9fff">截单时间</span>
                        </span>
                        <el-date-picker v-model="assemblyForm.cyTrailerTime" type="date" style="width: 100%;"
                            value-format="yyyy-MM-dd HH:mm" size="small" :disabled="detailData.seeDisabled"
                            placeholder="请选择截单时间">
                        </el-date-picker>
                    </el-form-item>
                </el-col> -->
        <!-- <el-col :span="6">
                    <el-form-item label="截港时间" prop="cyReturnTime">
                        <span slot="label">
                            <span style="color: #1e9fff">截港时间</span>
                        </span>
                        <el-date-picker v-model="assemblyForm.cyReturnTime" type="date" style="width: 100%;"
                            value-format="yyyy-MM-dd HH:mm" size="small" :disabled="detailData.seeDisabled"
                            placeholder="请选择截港时间">
                        </el-date-picker>
                    </el-form-item>
                </el-col> -->
        <!-- <el-col :span="6">
                    <el-form-item label="应结日期" prop="dueDate">
                        <span slot="label">
                            <span style="color: #1e9fff">应结日期</span>
                        </span>
                        <el-date-picker v-model="assemblyForm.dueDate" type="date" style="width: 100%;"
                            value-format="yyyy-MM-dd HH:mm:ss" size="small" :disabled="detailData.seeDisabled"
                            placeholder="请选择应结日期">
                        </el-date-picker>
                    </el-form-item>
                </el-col> -->
        <!-- <el-col :span="6">
                    <el-form-item label="订舱日期" prop="bookingDate">
                        <span slot="label">
                            <span style="color: #1e9fff">订舱日期</span>
                        </span>
                        <el-date-picker v-model="assemblyForm.bookingDate" type="date" style="width: 100%;"
                            value-format="yyyy-MM-dd HH:mm" size="small" :disabled="detailData.seeDisabled"
                            placeholder="请选择截港时间">
                        </el-date-picker>
                    </el-form-item>
                </el-col> -->
        <el-col :span="6">
          <el-form-item label="正本份数" prop="numberOfObl">
            <span slot="label">
              <span style="color: #1e9fff">正本份数</span>
            </span>
            <search-query
              :datalist="numberOfData"
              :selectValue="assemblyForm.numberOfObl"
              :clearable="true"
              :disabled="detailData.seeDisabled"
              :buttonIf="false"
              :forParameter="{ key: 'dictKey', label: 'dictValue', value: 'dictValue' }"
              placeholder="请选择正本份数"
              @corpChange="corpChange($event, 'Obl')"
              @corpFocus="remoteMethod($event, 'numberOfObl')"
            >
            </search-query>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="副本份数" prop="numberOfCopy">
            <span slot="label">
              <span style="color: #1e9fff">副本份数</span>
            </span>
            <search-query
              :datalist="numberOfData"
              :selectValue="assemblyForm.numberOfCopy"
              :clearable="true"
              :disabled="detailData.seeDisabled"
              :buttonIf="false"
              :forParameter="{ key: 'dictKey', label: 'dictValue', value: 'dictValue' }"
              placeholder="请选择副本份数"
              @corpChange="corpChange($event, 'Copy')"
              @corpFocus="remoteMethod($event, 'numberOfCopy')"
            >
            </search-query>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="服务方式" prop="serviceTerms">
            <span slot="label">
              <span style="color: #1e9fff">服务方式</span>
            </span>
            <search-query
              :datalist="serviceTermsData"
              :selectValue="assemblyForm.serviceTerms"
              :clearable="true"
              :disabled="detailData.seeDisabled"
              :buttonIf="false"
              :forParameter="{ key: 'id', label: 'code', value: 'code' }"
              placeholder="请选择服务方式"
              @remoteMethod="remoteMethod($event, 'serviceTerms')"
              @corpChange="corpChange($event, 'serviceTerms')"
              @corpFocus="remoteMethod($event, 'serviceTerms')"
            >
            </search-query>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="航线" prop="lineCnName">
            <span slot="label">
              <span style="color: #1e9fff">航线</span>
            </span>
            <search-query
              :datalist="lineData"
              :selectValue="assemblyForm.lineCnName"
              :filterable="true"
              :clearable="true"
              :remote="true"
              :disabled="detailData.seeDisabled || (assemblyForm.billType == 'MH' && assemblyForm.masterBillNo > 0)"
              :buttonIf="false"
              :forParameter="{ key: 'id', label: 'cnName', value: 'cnName' }"
              placeholder="请选择航线"
              @remoteMethod="remoteMethod($event, 'line')"
              @corpChange="corpChange($event, 'line')"
              @corpFocus="remoteMethod($event, 'line')"
            >
            </search-query>
          </el-form-item>
        </el-col>
        <!-- <el-col :span="6">
                    <el-form-item label="业务来源" prop="srcType" :rules="[{ required: true, message: '', trigger: 'blur' }]">
                        <el-row :gutter="10">
                            <el-col :span="10">
                                <search-query :datalist="sourceTypeData" :selectValue="assemblyForm.srcType"
                                    :filterable="true" :clearable="true" :remote="true" :buttonIf="false"
                                    :disabled="detailData.seeDisabled || assemblyForm.feeCenterListD.filter(item => item.auditStatus > 0).length || assemblyForm.feeCenterListC.filter(item => item.auditStatus > 0).length"
                                    placeholder="请选择业务来源" @corpChange="sourceCorp($event, 'srcType')">
                                </search-query>
                            </el-col>
                            <el-col :span="13">
                                <search-query :datalist="srcData" :selectValue="assemblyForm.srcCnName"
                                    :filterable="true" :clearable="true" :remote="true"
                                    :disabled="!assemblyForm.srcType || detailData.seeDisabled || assemblyForm.feeCenterListD.filter(item => item.auditStatus > 0).length || assemblyForm.feeCenterListC.filter(item => item.auditStatus > 0).length"
                                    :buttonIf="false" :forParameter="sourceforParameter" placeholder="请选择来源明细"
                                    @remoteMethod="sourceRemote($event, 'srcCnName')"
                                    @corpChange="sourceCorp($event, 'srcCnName')"
                                    @corpFocus="sourceRemote($event, 'srcCnName')">
                                </search-query>
                            </el-col>
                        </el-row>
                    </el-form-item>
                </el-col> -->
        <!-- <el-col :span="6">
                    <el-form-item label="AEA" prop="actualEta">
                        <span slot="label">
                            <span style="color: #1e9fff">AEA</span>
                        </span>
                        <el-date-picker v-model="assemblyForm.actualEta" type="date" style="width: 100%;"
                            value-format="yyyy-MM-dd HH:mm" size="small" :disabled="detailData.seeDisabled"
                            placeholder="请选择时间">
                        </el-date-picker>
                    </el-form-item>
                </el-col> -->
        <!-- <el-col :span="6">
                    <el-form-item label="ETA" prop="eta">
                        <span slot="label">
                            <span style="color: #1e9fff">ETA</span>
                        </span>
                        <el-date-picker v-model="assemblyForm.eta" type="date" style="width: 100%;"
                            value-format="yyyy-MM-dd HH:mm" size="small" :disabled="detailData.seeDisabled"
                            placeholder="请选择时间">
                        </el-date-picker>
                    </el-form-item>
                </el-col> -->
        <el-col :span="6">
          <el-form-item label="POL免箱使天数" prop="polFreeBoxUseDays" label-width="100px">
            <span slot="label">
              <span style="color: #1e9fff">POL免箱使天数</span>
            </span>
            <el-input
              v-model="assemblyForm.polFreeBoxUseDays"
              size="small"
              :controls="false"
              style="width: 100%;"
              placeholder="请输入POL免箱使天数"
              :disabled="detailData.seeDisabled"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="POD免箱使天数" prop="podFreeBoxUseDays" label-width="100px">
            <span slot="label">
              <span style="color: #1e9fff">POD免箱使天数</span>
            </span>
            <el-input
              v-model="assemblyForm.podFreeBoxUseDays"
              size="small"
              :controls="false"
              style="width: 100%;"
              placeholder="请输入POD免箱使天数"
              :disabled="detailData.seeDisabled"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="船代" prop="shippingAgencyCname">
            <span slot="label">
              <span style="color: #1e9fff">船代</span>
            </span>
            <dic-select
              v-model="assemblyForm.shippingAgencyCname"
              placeholder="船代"
              key="id"
              label="shortName"
              res="records"
              url="/blade-los/bcorps/selectList?current=1&size=5&corpTypeName=船代"
              :filterable="true"
              :remote="true"
              dataName="shortName"
              @selectChange="dicChange('shippingAgencyCname', $event)"
              :slotRight="true"
              rightLabel="code"
              :disabled="detailData.seeDisabled || (assemblyForm.billType == 'MH' && assemblyForm.masterBillNo > 0)"
            ></dic-select>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="退舱日期" prop="bookingWithdrawTime">
            <span slot="label">
              <span style="color: #1e9fff">退舱日期</span>
            </span>
            <el-date-picker
              v-model="assemblyForm.bookingWithdrawTime"
              type="date"
              style="width: 100%;"
              value-format="yyyy-MM-dd HH:mm"
              size="small"
              disabled
              placeholder="请选择退舱日期"
            >
            </el-date-picker>
          </el-form-item>
        </el-col>
        <!-- <el-col :span="6">
                    <el-form-item label="订舱代理" prop="bookingAgentCnName">
                        <span slot="label">
                            <span style="color: #1e9fff">订舱代理</span>
                        </span>
                        <el-col :span="9">
                            <search-query :datalist="bookingAgentData" :selectValue="assemblyForm.bookingAgentCnName"
                                :filterable="true" :clearable="true" :remote="true" :disabled="detailData.seeDisabled"
                                :buttonIf="false" placeholder="请选择订舱代理"
                                :forParameter="{ key: 'id', label: 'cnName', value: 'cnName' }"
                                @remoteMethod="remoteMethod($event, 'bookingAgent')"
                                @corpChange="corpChange($event, 'bookingAgent')"
                                @corpFocus="remoteMethod($event, 'bookingAgent')">
                            </search-query>
                        </el-col>
                        <el-col :span="14" :offset="1">
                            <el-input type="age" style="width: 100%;" v-model="assemblyForm.bookingAgentEnName"
                                size="small" autocomplete="off"
                                :disabled="detailData.seeDisabled || !assemblyForm.bookingAgentCnName" clearable
                                placeholder="订舱代理"></el-input>
                        </el-col>
                    </el-form-item>
                </el-col> -->
        <!-- <el-col :span="6">
                    <el-form-item label="装箱方式" prop="loadType">
                        <span slot="label">
                            <span style="color: #1e9fff">装箱方式</span>
                        </span>
                        <search-query :datalist="loadTypeData" :selectValue="assemblyForm.loadType" :filterable="true"
                            :clearable="true" :remote="true" :disabled="detailData.seeDisabled" :buttonIf="false"
                            :forParameter="{ key: 'dictKey', label: 'dictValue', value: 'dictKey', }"
                            placeholder="请选择装箱方式" @corpChange="corpChange($event, 'loadType')">
                        </search-query>
                    </el-form-item>
                </el-col> -->

        <el-col span="6">
          <el-form-item label="签单地点" prop="issueAt">
            <span slot="label">
              <span style="color: #1e9fff">签单地点</span>
            </span>
            <search-query
              :datalist="issueAtData"
              :selectValue="assemblyForm.issueAt"
              :filterable="true"
              :clearable="true"
              :remote="true"
              :disabled="detailData.seeDisabled"
              :buttonIf="false"
              :forParameter="{ key: 'id', label: 'enName', value: 'enName' }"
              placeholder="请选择签单地点"
              @remoteMethod="remoteMethod($event, 'issueAt')"
              @corpChange="corpChange($event, 'issueAt')"
              @corpFocus="remoteMethod($event, 'issueAt')"
            >
            </search-query>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="签单方式" prop="issueType">
            <span slot="label">
              <span style="color: #1e9fff">签单方式</span>
            </span>
            <el-select
              style="width: 100%"
              v-model="assemblyForm.issueType"
              size="small"
              placeholder="请选择签单方式"
              :filterable="true"
              :clearable="true"
              :disabled="detailData.seeDisabled"
            >
              <el-option v-for="item in issueTypeData" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"> </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="签单日期" prop="issueDate" label-width="80px">
            <span slot="label">
              <span style="color: #1e9fff">签单日期</span>
            </span>
            <el-date-picker
              style="width: 100%;"
              v-model="assemblyForm.issueDate"
              clearable
              type="date"
              size="small"
              :disabled="detailData.seeDisabled"
              value-format="yyyy-MM-dd"
              placeholder="选择日期"
            >
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="业务类型" prop="businessTypes">
            <span slot="label">
              <span style="color: #1e9fff">业务类型</span>
            </span>
            <search-query
              :datalist="businessTypesData"
              :selectValue="assemblyForm.businessTypes"
              :forParameter="{ key: 'dictKey', label: 'dictValue', value: 'dictKey' }"
              :filterable="true"
              :clearable="true"
              :remote="true"
              :disabled="detailData.seeDisabled"
              :buttonIf="false"
              placeholder="请选择业务类型"
              @corpChange="corpChange($event, 'businessTypes')"
            >
            </search-query>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="HB/L付款地点" prop="hpayplace">
            <span slot="label">
              <span style="color: #1e9fff">HB/L付款地点</span>
            </span>
            <search-query
              :datalist="hpayplaceData"
              :selectValue="assemblyForm.hpayplace"
              :filterable="true"
              :clearable="true"
              :remote="true"
              :disabled="detailData.seeDisabled"
              :buttonIf="false"
              :forParameter="{ key: 'id', label: 'enName', value: 'enName' }"
              placeholder="请选择HB/L付款地点"
              @remoteMethod="remoteMethod($event, 'hpayplace')"
              @corpChange="corpChange($event, 'hpayplace')"
              @corpFocus="remoteMethod($event, 'hpayplace')"
            >
            </search-query>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="MB/L付款地点" prop="mPayplace">
            <span slot="label">
              <span style="color: #1e9fff">MB/L付款地点</span>
            </span>
            <search-query
              :datalist="mpayplaceData"
              :selectValue="assemblyForm.mpayplace"
              :filterable="true"
              :clearable="true"
              :remote="true"
              :disabled="detailData.seeDisabled"
              :buttonIf="false"
              :forParameter="{ key: 'id', label: 'enName', value: 'enName' }"
              placeholder="请选择MB/L付款地点"
              @remoteMethod="remoteMethod($event, 'mpayplace')"
              @corpChange="corpChange($event, 'mpayplace')"
              @corpFocus="remoteMethod($event, 'mpayplace')"
            >
            </search-query>
          </el-form-item>
        </el-col>
        <!-- <el-col :span="6">
                    <el-form-item label="箱属" prop="boxBelongsTo">
                        <span slot="label">
                            <span style="color: #1e9fff">箱属</span>
                        </span>
                        <dic-select v-model="assemblyForm.boxBelongsTo" placeholder="箱属" key="dictKey" label="dictValue"
                            url="/blade-system/dict-biz/dictionary?code=boxBelongsTo" :filterable="true"
                            :disabled="detailData.seeDisabled"></dic-select>
                    </el-form-item>
                </el-col> -->
        <!-- <el-col :span="6">
                    <el-form-item label="箱属" prop="boxBelongsTo">
                        <span slot="label">
                            <span style="color: #1e9fff">箱属</span>
                        </span>
                        <dic-select v-model="assemblyForm.boxBelongsTo" placeholder="箱属" key="dictKey" label="dictValue"
                            url="/blade-system/dict-biz/dictionary?code=boxBelongsTo" :filterable="true"
                            :disabled="detailData.seeDisabled"></dic-select>
                    </el-form-item>
                </el-col> -->
        <!-- <el-col :span="6">
                    <el-form-item label="舱位类型" prop="cabinType">
                        <span slot="label">
                            <span style="color: #1e9fff">舱位类型</span>
                        </span>
                        <el-col :span="12">
                            <dic-select v-model="assemblyForm.cabinType" placeholder="舱位类型" key="id" label="dictValue"
                                url="/blade-system/dict-biz/dictionary?code=cabinType"
                                :disabled="detailData.seeDisabled"
                                @selectChange="dicChange('cabinType', $event)"></dic-select>
                        </el-col>
                        <el-col :span="11" :offset="1">
                            <div>
                                <dic-select v-show="assemblyForm.cabinType == '固定' || !assemblyForm.cabinType"
                                    v-model="assemblyForm.cabinTypeData" key="id" label="dictValue" placeholder="数据"
                                    url="/blade-system/dict-biz/dictionary?code=cabinTypeData_1"
                                    :disabled="detailData.seeDisabled || !assemblyForm.cabinType"></dic-select>
                                <dic-select v-show="assemblyForm.cabinType == '非固定'"
                                    v-model="assemblyForm.cabinTypeData" key="id" label="dictValue" placeholder="数据"
                                    url="/blade-system/dict-biz/dictionary?code=cabinTypeData_2"
                                    :disabled="detailData.seeDisabled"></dic-select>
                            </div>
                        </el-col>
                    </el-form-item>
                </el-col> -->
        <!-- <el-col :span="6">
                    <el-form-item label="舱位数" prop="shippingSpaceNumber">
                        <span slot="label">
                            <span style="color: #1e9fff">舱位数</span>
                        </span>
                        <el-input-number v-model="assemblyForm.shippingSpaceNumber" size="small" :controls="false"
                            style="width: 100%;" placeholder="请输入舱位数"></el-input-number>
                    </el-form-item>
                </el-col> -->
        <!-- <el-col :span="6">
                    <el-form-item label="限制重量(吨)" prop="weightLimit">
                        <span slot="label">
                            <span style="color: #1e9fff">限制重量(吨)</span>
                        </span>
                        <el-input-number v-model="assemblyForm.weightLimit" size="small" :controls="false"
                            style="width: 100%;" placeholder="请输入限制重量(吨)"></el-input-number>
                    </el-form-item>
                </el-col> -->
        <!-- <el-col :span="6">
                    <el-form-item label="限制舱位(T)" prop="restrictedCabinSpace">
                        <span slot="label">
                            <span style="color: #1e9fff">限制舱位(T)</span>
                        </span>
                        <el-input v-model="assemblyForm.restrictedCabinSpace" size="small" placeholder="请输入限制舱位(T)"
                            style="width: 100%;"></el-input>
                    </el-form-item>
                </el-col> -->
        <el-col :span="6">
          <el-form-item label="单据类型" prop="billType">
            <span slot="label">
              <span style="color: #1e9fff">单据类型</span>
            </span>
            <search-query
              :datalist="billTypeData"
              :selectValue="assemblyForm.billType"
              :filterable="true"
              :clearable="true"
              :remote="true"
              :disabled="true"
              :buttonIf="false"
              placeholder="请选择单据类型"
              @corpChange="corpChange($event, 'billType')"
            >
            </search-query>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="" prop="billNo">
            <span slot="label">
              <span style="color: #1e9fff">单据编号</span>
            </span>
            <el-input v-model="assemblyForm.billNo" size="small" placeholder="请输入单据编号" style="width: 100%;" disabled></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="4">
          <el-form-item label="" prop="createUserName">
            <span slot="label">
              <span style="color: #1e9fff">制单人</span>
            </span>
            <el-input v-model="assemblyForm.createUserName" size="small" placeholder="请输入单据编号" style="width: 100%;" disabled></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="5">
          <el-form-item label="" prop="createTime">
            <span slot="label">
              <span style="color: #1e9fff">制单日期</span>
            </span>
            <el-input v-model="assemblyForm.createTime" size="small" placeholder="请输入单据编号" style="width: 100%;" disabled></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="4">
          <el-form-item label="" prop="updateUserName">
            <span slot="label">
              <span style="color: #1e9fff">修改人</span>
            </span>
            <el-input v-model="assemblyForm.updateUserName" size="small" placeholder="请输入单据编号" style="width: 100%;" disabled></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="5">
          <el-form-item label="" prop="updateTime">
            <span slot="label">
              <span style="color: #1e9fff">修改日期</span>
            </span>
            <el-input v-model="assemblyForm.updateTime" size="small" placeholder="请输入单据编号" style="width: 100%;" disabled></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <!-- <el-row>
                <el-col :span="6">
                    <el-checkbox size="medium" :true-label="1" :false-label="0" :disabled="detailData.seeDisabled"
                        v-model="assemblyForm.isLargeCargo">大件货</el-checkbox>
                </el-col>
                <el-col :span="6">
                    <div>
                        <el-checkbox size="medium" :true-label="1" :false-label="0" :disabled="detailData.seeDisabled"
                            v-model="assemblyForm.isNeedLand">陆运</el-checkbox>
                        <el-checkbox size="medium" :true-label="1" :false-label="0" :disabled="detailData.seeDisabled"
                            v-model="assemblyForm.isNeedDeclare">需报关</el-checkbox>
                        <el-checkbox size="medium" :true-label="1" :false-label="0" :disabled="detailData.seeDisabled"
                            v-model="assemblyForm.isNeedIq">需三检</el-checkbox>
                    </div>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="箱数或件数大写" prop="quantityPackingDescr" label-width="100px">
                        <span slot="label">
                            <span style="color: #1e9fff">箱数或件数大写</span>
                        </span>
                        <el-input type="age" style="width: 100%;" v-model="assemblyForm.quantityPackingDescr"
                            size="small" autocomplete="off" :disabled="true" clearable
                            placeholder="请输入箱数或件数大写"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="创建日期" prop="cyTrailerTime">
                        <span slot="label">
                            <span style="color: #1e9fff">创建日期</span>
                        </span>
                        <el-date-picker v-model="assemblyForm.createTime" type="date" style="width: 100%;"
                            value-format="yyyy-MM-dd" size="small" :disabled="true" placeholder="请选择创建日期">
                        </el-date-picker>
                    </el-form-item>
                </el-col>
            </el-row> -->
    </el-form>

    <el-dialog title="INTTRA EDI" :visible.sync="inttraVisible" width="50%" append-to-body :before-close="beforeClose">
      <div>
        <el-form :model="assemblyForm" ref="form" label-width="160px">
          <el-row v-if="inttraDoorToVisible" :gutter="20">
            <el-col :span="12">
              <el-form-item :label="`DOOR TO 客户名称`" prop="hNotify2CnName">
                <el-input
                  type="age"
                  style="width: 100%;"
                  v-model="assemblyForm.detail[`inttraDoorToCorpName`]"
                  size="small"
                  autocomplete="off"
                  :disabled="detailData.seeDisabled"
                  clearable
                  :placeholder="`请输入 DOOR TO 客户名称`"
                  @input="inttraTitleInput($event, 'CorpName')"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="`DOOR TO 客户地址`">
                <el-input
                  type="age"
                  style="width: 100%;"
                  v-model="assemblyForm.detail[`inttraDoorToCorpAddr`]"
                  size="small"
                  autocomplete="off"
                  :disabled="detailData.seeDisabled"
                  clearable
                  :placeholder="`请输入${inttraText} 客户地址`"
                  @input="inttraTitleInput($event, 'CorpAddr')"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="`DOOR TO 联系人`">
                <el-input
                  type="age"
                  style="width: 100%;"
                  v-model="assemblyForm.detail[`inttraDoorToCorpContacts`]"
                  size="small"
                  autocomplete="off"
                  :disabled="detailData.seeDisabled"
                  clearable
                  :placeholder="`请输入 DOOR TO 联系人`"
                  @input="inttraTitleInput($event, 'CorpContacts')"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="`DOOR TO 联系电话`">
                <el-input
                  type="age"
                  style="width: 100%;"
                  v-model="assemblyForm.detail[`inttraDoorToCorpTel`]"
                  size="small"
                  autocomplete="off"
                  :disabled="detailData.seeDisabled"
                  clearable
                  :placeholder="`请输入 DOOR TO 联系人电话`"
                  @input="inttraTitleInput($event, 'CorpTel')"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>

          <el-row v-if="inttraToDoorVisible" :gutter="20">
            <el-col :span="12">
              <el-form-item :label="`TO DOOR 客户名称`" prop="hNotify2CnName">
                <el-input
                  type="age"
                  style="width: 100%;"
                  v-model="assemblyForm.detail[`inttraToDoorCorpName`]"
                  size="small"
                  autocomplete="off"
                  :disabled="detailData.seeDisabled"
                  clearable
                  :placeholder="`请输入 TO DOOR 客户名称`"
                  @input="inttraTitleInput($event, 'CorpName')"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="`TO DOOR 客户地址`">
                <el-input
                  type="age"
                  style="width: 100%;"
                  v-model="assemblyForm.detail[`inttraToDoorCorpAddr`]"
                  size="small"
                  autocomplete="off"
                  :disabled="detailData.seeDisabled"
                  clearable
                  :placeholder="`请输入 TO DOOR 客户地址`"
                  @input="inttraTitleInput($event, 'CorpAddr')"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="`TO DOOR 联系人`">
                <el-input
                  type="age"
                  style="width: 100%;"
                  v-model="assemblyForm.detail[`inttraToDoorCorpContacts`]"
                  size="small"
                  autocomplete="off"
                  :disabled="detailData.seeDisabled"
                  clearable
                  :placeholder="`请输入 TO DOOR 联系人`"
                  @input="inttraTitleInput($event, 'CorpContacts')"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="`TO DOOR 联系电话`">
                <el-input
                  type="age"
                  style="width: 100%;"
                  v-model="assemblyForm.detail[`inttraToDoorCorpTel`]"
                  size="small"
                  autocomplete="off"
                  :disabled="detailData.seeDisabled"
                  clearable
                  :placeholder="`请输入 TO DOOR 联系人电话`"
                  @input="inttraTitleInput($event, 'CorpTel')"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button type="danger" @click="inttraCancellation('清除')">清 除</el-button>
        <el-button type="primary" @click="inttraVisible = false">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import SearchQuery from "@/components/iosbasic-data/searchquery.vue";
import { getBcorpslistByType, getBcorpsDetail } from "@/api/iosBasicData/bcorps";
import { getWorkDicts } from "@/api/system/dictbiz";
import { bportsList } from "@/api/iosBasicData/bports";
import emailhash from "@/views/iosBasicData/SeafreightExportF/bills/assembly/Jsonfile/emailhash.json";
import { getBcorpsattnList } from "@/api/iosBasicData/bcorpsattn";
import { getBservicetermsList } from "@/api/iosBasicData/bserviceterms";
import { blinesList } from "@/api/iosBasicData/blines";
import { getDeptLazyTree } from "@/api/system/dept";
import { selectListLos } from "@/api/approval/processConfig";
import dicSelect from "@/components/dicSelect/main";
export default {
  components: { SearchQuery, dicSelect },
  props: {
    assemblyForm: {
      type: Object
    },
    detailData: {
      type: Boolean
    },
    // 是否生成账单
    generateBillsfalse: {
      type: Boolean,
      default: false
    },
    disabled: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      // 订舱代理数据
      bookingAgentData: [],
      // 业务来源
      sourceTypeData: [
        {
          label: "公司",
          value: "OWN"
        },
        {
          label: "代理",
          value: "AGENT"
        },
        {
          label: "业务员",
          value: "SALES"
        }
      ],
      // 业务来源下级配置
      sourceforParameter: {},
      // 业务来源下级
      srcData: [],
      emailhash: emailhash, // 邮箱跳转地址
      lineData: [], // 航线
      // 场站
      cyData: [],
      cyContactsData: [], // 场站联系人
      // 服务方式
      serviceTermsData: [],
      // HB/L付款地点数据
      hpayplaceData: [],
      // MB/L付款地点
      mpayplaceData: [],
      // 签单地点
      issueAtData: [],
      // INTTRA EDI弹窗
      inttraVisible: false,
      inttraDoorToVisible: false,
      inttraToDoorVisible: false,
      inttraText: "", // 服务方式弹窗字段拼接
      inttraTitle: "",
      inttraData: [],
      // 份数
      numberOfData: [],
      // 签单方式
      issueTypeData: [],
      // 装箱方式
      loadTypeData: [],
      // 业务类型
      businessTypesData: [],
      // 单据类型
      billTypeData: [
        {
          label: "直单",
          value: "DD"
        },
        {
          label: "主单",
          value: "MM"
        },
        {
          label: "分单",
          value: "MH"
        }
      ]
    };
  },
  created() {
    // this.cyBcorpslistByType()
    this.getWorkDictsfun();
    // this.ownDeptLazyTreefun()
  },
  methods: {
    dicChange(name, row) {
      if (name == "cabinType") {
        this.assemblyForm.cabinTypeData = null;
      }
      if (name == "shippingAgencyCname") {
        if (row) {
          this.assemblyForm.shippingAgencyId = row.id;
          this.assemblyForm.shippingAgencyEname = row.enName;
        } else {
          this.assemblyForm.shippingAgencyId = null;
          this.assemblyForm.shippingAgencyEname = null;
          this.assemblyForm.shippingAgencyCname = null;
        }
      }
    },
    // 业务来源下拉
    sourceCorp(value, name) {
      if (name == "srcCnName") {
        if (!value) {
          this.$set(this.assemblyForm, "srcId", "");
          this.$set(this.assemblyForm, "srcCnName", "");
          this.$set(this.assemblyForm, "srcEnName", "");
        }
        for (let item of this.srcData) {
          if (item[this.sourceforParameter.value] == value) {
            if (this.assemblyForm.srcType == "OWN") {
              // 国家
              this.$set(this.assemblyForm, "srcId", item.id);
              this.$set(this.assemblyForm, "srcCnName", item.title);
              this.$set(this.assemblyForm, "srcEnName", item.title);
            } else if (this.assemblyForm.srcType == "AGENT") {
              // 代理
              this.$set(this.assemblyForm, "srcId", item.id);
              this.$set(this.assemblyForm, "srcCnName", item.cnName);
              this.$set(this.assemblyForm, "srcEnName", item.cnName);
            } else if (this.assemblyForm.srcType == "SALES") {
              // 业务员
              this.$set(this.assemblyForm, "srcId", item.id);
              this.$set(this.assemblyForm, "srcCnName", item.name);
              this.$set(this.assemblyForm, "srcEnName", item.name);
            }
          }
        }
      } else if (name == "srcType") {
        this.$set(this.assemblyForm, "srcType", value);
        this.$set(this.assemblyForm, "srcId", "");
        this.$set(this.assemblyForm, "srcCnName", "");
        this.$set(this.assemblyForm, "srcEnName", "");
        if (this.assemblyForm.srcType == "OWN") {
          this.sourceforParameter = { key: "id", label: "title", value: "title" };
          this.ownDeptLazyTreefun();
        } else if (this.assemblyForm.srcType == "AGENT") {
          this.sourceforParameter = { key: "id", label: "cnName", value: "cnName" };
          this.agentBcorpsListfun();
        } else if (this.assemblyForm.srcType == "SALES") {
          this.sourceforParameter = { key: "id", label: "name", value: "name" };
          this.salesUserGetListfun();
        }
      }
    },
    // 业务来源接口
    sourceRemote(value, name) {
      if (name == "srcCnName") {
        if (this.assemblyForm.srcType == "OWN") {
          this.sourceforParameter = { key: "id", label: "title", value: "title" };
          this.ownDeptLazyTreefun();
        } else if (this.assemblyForm.srcType == "AGENT") {
          this.sourceforParameter = { key: "id", label: "cnName", value: "cnName" };
          this.agentBcorpsListfun(value);
        } else if (this.assemblyForm.srcType == "SALES") {
          this.sourceforParameter = { key: "id", label: "name", value: "name" };
          this.salesUserGetListfun(value);
        }
      }
    },
    // 获取业务来源代理数据
    agentBcorpsListfun(cnName) {
      let corpTypeName = "国内直接客户,国内同行及代理,国外直接客户,国外同行及代理,代理客户";
      getBcorpslistByType(1, 10, { cnName, corpTypeName }).then(res => {
        this.srcData = res.data.data.records;
      });
    },
    // 订舱代理
    bookingAgentBcorpsListfun(cnName) {
      let corpTypeName = "国内直接客户,国内同行及代理,国外直接客户,国外同行及代理";
      getBcorpslistByType(1, 10, { cnName, status: 0, corpTypeName }).then(res => {
        this.bookingAgentData = res.data.data.records;
      });
    },
    // 获取业务来源业务员数据
    salesUserGetListfun(account) {
      selectListLos("业务员").then(res => {
        this.srcData = res.data.data;
      });
    },
    // 获取公司名称 用户管理左侧
    ownDeptLazyTreefun() {
      getDeptLazyTree(0).then(res => {
        this.srcData = res.data.data;
        // 来源 内容 默认登录人所属公司
        for (let item of this.srcData) {
          if (item.id == JSON.parse(localStorage.getItem("saber-userInfo")).content.dept_id) {
            this.$set(this.assemblyForm, "srcId", item.id);
            this.$set(this.assemblyForm, "srcCnName", item.title);
            this.$set(this.assemblyForm, "srcEnName", item.title);
          }
        }
      });
    },
    // 远程搜索
    remoteMethod(value, name) {
      let inttraArr = ["inttraDoorTo", "inttraToDoor"];
      let numberOfArr = ["numberOfObl", "numberOfCopy"];
      let payplaceArr = ["hpayplace", "mpayplace", "issueAt"];
      if (name == "cy") {
        this.cyBcorpslistByType(value);
      } else if (inttraArr.indexOf(name) != -1) {
        this.inttraBcorpslistByType(value);
      } else if (name == "bookingAgent") {
        this.bookingAgentBcorpsListfun(value);
      }
      // else if (name == 'issueType') {
      //     // 签单方式
      //     this.getWorkDictsfun()
      // }
      // 场站联系人
      else if (name == "cyContacts") {
        this.cyBcorpsattnListfun();
      }
      // 份数
      else if (numberOfArr.indexOf(name) != -1) {
        this.numberoforiginalWorkDicts();
      }
      // 服务方式
      else if (name == "serviceTerms") {
        this.serviceTermsWorkDicts();
      }
      // HB/L付款状态 MB/L 付款状态
      else if (payplaceArr.indexOf(name) != -1) {
        this[name + "BportsListfun"](value);
      } else if (name == "line") {
        this.lineblinesListfun(value);
      }
    },
    // 选择框的回调
    corpChange(value, name) {
      let inttraArr = ["inttraDoorTo", "inttraToDoor"];
      let numberOfArr = ["Obl", "Copy"];
      if (name == "cy") {
        if (!value) {
          this.$set(this.assemblyForm, "cyId", "");
          this.$set(this.assemblyForm, "cyCode", "");
          this.$set(this.assemblyForm, "cyCnName", "");
          this.$set(this.assemblyForm, "cyEnName", "");
          this.$set(this.assemblyForm, "cyRemarks", "");
          // 联系人
          this.$set(this.assemblyForm, "cyTel", "");
          this.$set(this.assemblyForm, "cyAddress", "");
          this.$set(this.assemblyForm, "cyContacts", "");
        }
        for (let item of this.cyData) {
          if (item.cnName == value) {
            this.$set(this.assemblyForm, "cyId", item.id);
            this.$set(this.assemblyForm, "cyCode", item.code);
            this.$set(this.assemblyForm, "cyCnName", item.cnName);
            this.$set(this.assemblyForm, "cyEnName", item.enName);
            this.$set(this.assemblyForm, "cyRemarks", item.details); // 客户里的详情信息
            // 查询场站联系人
            getBcorpsattnList(1, 20, { pid: this.assemblyForm.cyId }).then(res => {
              console.log(res, 590);
              this.$set(this.assemblyForm, "cyTel", res.data.data.records[0].tel);
              this.$set(this.assemblyForm, "cyAddress", res.data.data.records[0].addr);
              this.$set(this.assemblyForm, "cyContacts", res.data.data.records[0].cname);
            });
          }
        }
      }
      // 场站联系人
      else if (name == "cyContacts") {
        if (!value) {
          this.$set(this.assemblyForm, "cyTel", "");
          this.$set(this.assemblyForm, "cyAddress", "");
          this.$set(this.assemblyForm, "cyContacts", "");
        }
        for (let item of this.cyContactsData) {
          if (item.cname == value) {
            this.$set(this.assemblyForm, "cyTel", item.tel);
            this.$set(this.assemblyForm, "cyAddress", item.addr);
            this.$set(this.assemblyForm, "cyContacts", item.cname);
          }
        }
      } else if (inttraArr.indexOf(name) != -1) {
        for (let item of this.inttraData) {
          if (item.cnName == value) {
            this.$set(this.assemblyForm, `inttra${this.inttraTitle}CorpName`, item.cnName);
            this.$set(this.assemblyForm, `inttra${this.inttraTitle}CorpAddr`, item.cnAddr);
            this.$set(this.assemblyForm, `inttra${this.inttraTitle}CorpContacts`, item.attnName);
            this.$set(this.assemblyForm, `inttra${this.inttraTitle}CorpTel`, item.attnTel);
          }
        }
      }
      // 份数
      else if (numberOfArr.indexOf(name) != -1) {
        if (!value) {
          this.$set(this.assemblyForm, "numberOf" + name, "");
          this.$set(this.assemblyForm, "numberOf" + name + "Digit", "");
        }
        for (let item of this.numberOfData) {
          if (item.dictValue == value) {
            this.$set(this.assemblyForm, "numberOf" + name, item.dictValue);
            this.$set(this.assemblyForm, "numberOf" + name + "Digit", item.dictKey);
          }
        }
      }
      // 签单地点
      else if (name == "issueAt") {
        for (let item of this.issueAtData) {
          if (item.enName == value) {
            this.$set(this.assemblyForm, "issueAt", item.enName);
            this.$set(this.assemblyForm, "issueAtId", item.id);
          }
        }
      }
      // 航线
      else if (name == "line") {
        for (let item of this[name + "Data"]) {
          if (item.cnName == value) {
            this.$set(this.assemblyForm, "lineId", item.id);
            this.$set(this.assemblyForm, "lineCnName", item.cnName);
            this.$set(this.assemblyForm, "lineEnName", item.enName);
          }
        }
      }
      // 订舱代理
      else if (name == "bookingAgent") {
        if (!value) {
          this.$set(this.assemblyForm, "bookingAgentId", "");
          this.$set(this.assemblyForm, "bookingAgentCnName", "");
          this.$set(this.assemblyForm, "bookingAgentEnName", "");
          this.$set(this.assemblyForm, "bookingRemarks", "");
        }
        for (let item of this[name + "Data"]) {
          if (item.cnName == value) {
            this.$set(this.assemblyForm, "bookingAgentId", item.id);
            this.$set(this.assemblyForm, "bookingAgentCnName", item.cnName);
            this.$set(this.assemblyForm, "bookingAgentEnName", item.enName);
            this.$set(this.assemblyForm, "bookingRemarks", item.remarks);
          }
        }
      } else {
        this.assemblyForm[name] = value ? value : "";
      }
    },
    // 获取航线数据
    lineblinesListfun(cnName) {
      blinesList(1, 10, { cnName, status: 0 }).then(res => {
        this.lineData = res.data.data.records;
      });
    },
    // INTTRA EDI弹窗 输入框监听
    inttraTitleInput(value, name) {
      // if (this.assemblyForm.serviceTerms == 'DOOR to DOOR') {
      //     this.$set(this.assemblyForm,`inttraDoorTo${name}`,value)
      //     this.$set(this.assemblyForm,`inttraToDoor${name}`,value)
      // }else {
      //     this.$set(this.assemblyForm,`inttra${this.inttraTitle}${name}`,value)
      // }
    },
    // 发送INTTRA EDI弹窗开启
    inttraAdd() {
      if (!this.assemblyForm.serviceTerms) {
        this.$message({
          showClose: true,
          message: "请先选择服务方式",
          type: "warning"
        });
        return;
      }
      if (this.assemblyForm.serviceTerms == "DOOR to CY") {
        this.inttraTitle = "DoorTo";
        this.inttraText = "DOOR TO";
        // this.inttraBcorpslistByType()
        this.inttraVisible = true;
        this.inttraDoorToVisible = true;
        this.inttraToDoorVisible = false;
        //
      } else if (this.assemblyForm.serviceTerms == "CY to DOOR") {
        this.inttraTitle = "ToDoor";
        this.inttraText = "TO DOOR";
        // this.inttraBcorpslistByType()
        this.inttraVisible = true;
        this.inttraDoorToVisible = false;
        this.inttraToDoorVisible = true;
      } else if (this.assemblyForm.serviceTerms == "DOOR to DOOR") {
        this.inttraTitle = "ToDoor";
        this.inttraText = "DOOR TO DOOR";
        // this.inttraBcorpslistByType()
        this.inttraVisible = true;
        this.inttraDoorToVisible = true;
        this.inttraToDoorVisible = true;
      } else {
        this.$confirm("请选择其他的服务方式", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            console.log("123123");
          })
          .catch(() => {
            console.log("11111111");
          });
      }
      console.log(this.assemblyForm.serviceTerms, this.inttraDoorToVisible, this.inttraToDoorVisible);
    },
    // INTTRA EDI弹窗清除
    inttraCancellation(name) {
      let title = "";
      if (name == "清除") {
        title = "确认清除吗？";
      }
      this.$confirm(title)
        .then(_ => {
          if (this.assemblyForm.serviceTerms == "DOOR to DOOR") {
            this.$set(this.assemblyForm, "inttraDoorToCorpName", "");
            this.$set(this.assemblyForm, "inttraDoorToCorpAddr", "");
            this.$set(this.assemblyForm, "inttraDoorToCorpContacts", "");
            this.$set(this.assemblyForm, "inttraDoorToCorpTel", "");
            this.$set(this.assemblyForm, "inttraToDoorCorpName", "");
            this.$set(this.assemblyForm, "inttraToDoorCorpAddr", "");
            this.$set(this.assemblyForm, "inttraToDoorCorpContacts", "");
            this.$set(this.assemblyForm, "inttraToDoorCorpTel", "");
          } else {
            this.$set(this.assemblyForm, `inttra${this.inttraTitle}CorpName`, "");
            this.$set(this.assemblyForm, `inttra${this.inttraTitle}CorpAddr`, "");
            this.$set(this.assemblyForm, `inttra${this.inttraTitle}CorpContacts`, "");
            this.$set(this.assemblyForm, `inttra${this.inttraTitle}CorpTel`, "");
          }
          this.inttraVisible = false;
        })
        .catch(_ => {});
    },
    // 弹窗关闭
    beforeClose(done) {
      done();
    },
    // 邮箱跳转
    emailJump() {
      if (!this.assemblyForm.cyId) {
        this.$message({
          message: "请先选择场站",
          type: "warning"
        });
        return;
      }
      // 调详情获取邮箱
      getBcorpsDetail(this.assemblyForm.cyId).then(res => {
        let email = res.data.data.email.split("@")[1]; // 取@符号后面的数据
        for (let i in this.emailhash) {
          if (email == i) {
            // 跳转打开一个新的页面
            window.open(this.emailhash[i], "_blank");
          }
        }
      });
    },
    // 接口数据请求🙏🙏🙏🙏🙏🙏🙏🙏🙏🙏
    // 获取场站数据
    cyBcorpslistByType(cnName) {
      let corpTypeName = "场站";
      getBcorpslistByType(1, 10, { cnName, status: 0, corpTypeName }).then(res => {
        this.cyData = res.data.data.records;
      });
    },
    // 获取场站下的联系人数据
    cyBcorpsattnListfun() {
      getBcorpsattnList(1, 20, { pid: this.assemblyForm.cyId }).then(res => {
        this.cyContactsData = res.data.data.records;
      });
    },
    // 获取客户数据
    inttraBcorpslistByType(cnName) {
      getBcorpslistByType(1, 10, { cnName, status: 0 }).then(res => {
        this.inttraData = res.data.data.records;
      });
    },
    // 获取签单方式字典数据
    getWorkDictsfun() {
      getWorkDicts("issue_type_F").then(res => {
        this.issueTypeData = res.data.data;
      });
      getWorkDicts("packing_method").then(res => {
        this.loadTypeData = res.data.data;
      });
      getWorkDicts("business_Type_detail").then(res => {
        this.businessTypesData = res.data.data;
      });
    },
    // 获取份数数据
    numberoforiginalWorkDicts() {
      getWorkDicts("number_of_original").then(res => {
        this.numberOfData = res.data.data;
      });
    },
    // 获取服务方式数据
    serviceTermsWorkDicts() {
      // getWorkDicts('service_terms').then(res=>{
      //     this.serviceTermsData = res.data.data
      // })
      getBservicetermsList(1, 20, { status: 0 }).then(res => {
        this.serviceTermsData = res.data.data.records;
      });
    },
    // HB/L 付款地点
    hpayplaceBportsListfun(enName) {
      bportsList(1, 10, { enName, status: 0 }).then(res => {
        this.hpayplaceData = res.data.data.records;
      });
    },
    // MB/L 付款地点
    mpayplaceBportsListfun(enName) {
      bportsList(1, 10, { enName, status: 0 }).then(res => {
        this.mpayplaceData = res.data.data.records;
      });
    },
    // 签单地点
    issueAtBportsListfun(enName) {
      bportsList(1, 10, { enName, status: 0 }).then(res => {
        this.issueAtData = res.data.data.records;
      });
    }
  }
};
</script>

<style lang="scss" scoped>
::v-deep.el-form-item {
  margin-bottom: 10px;
}

::v-deep .el-input-number .el-input__inner {
  text-align: left;
}

::v-deep .el-select > .el-input {
  display: inline-block !important;
}
</style>