Warehouse_management_ui/src/views/kaihe/domesticTrade/orderInformation/index.vue

<template>
  <div class="app-container">
    <el-button
      icon="el-icon-arrow-left"
      type="danger"
      v-if="cancelButton === true"
      @click="cancel"
      style="margin-bottom: 5px"
      >返回列表
    </el-button>

    <el-collapse v-model="activeNames">
      <el-collapse-item title="基础资料" name="1">
        <el-form
          ref="form"
          :model="form"
          label-width="130px"
          size="mini"
          class="selectForm"
          :rules="rules"
        >
          <el-row>
            <el-col :span="6">
              <el-form-item label="订舱单位" prop="corpName">
                <el-input
                  v-model="form.corpName"
                  :disabled="modify"
                  size="small"
                  style="width: 100%"
                />
              </el-form-item>
            </el-col>

            <el-col :span="6">
              <el-form-item label="提单号" prop="fMblno">
                <el-input
                  v-model="form.fMblno"
                  :disabled="changeNum"
                  size="small"
                  style="width: 100%"
                  placeholder="手工输入"
                />
              </el-form-item>
            </el-col>

            <el-col :span="6">
              <el-form-item label="起运港口" prop="fDestportid">
                <el-select
                  v-model="form.fLoadportid"
                  filterable
                  remote
                  style="width: 100%"
                  :disabled="modify"
                  class="elSelect"
                  placeholder="请输入模糊查找目的港口"
                >
                  <el-scrollbar>
                    <el-option
                      v-for="dict in fMblnoOptions"
                      :key="dict.fId"
                      :label="dict.fName"
                      :value="dict.fId"
                    ></el-option>
                  </el-scrollbar>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="目的港口" prop="destportid">
                <el-select
                  v-model="form.fDestportid"
                  filterable
                  remote
                  style="width: 100%"
                  :disabled="modify"
                  class="elSelect"
                  placeholder="请输入模糊查找目的港口"
                >
                  <el-scrollbar>
                    <el-option
                      v-for="dict in fMblnoOptions"
                      :key="dict.fId"
                      :label="dict.fName"
                      :value="dict.fId"
                    ></el-option>
                  </el-scrollbar>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
               <el-row>
            <el-col :span="6">
              <el-form-item label="预计装货时间" prop="fBsdate">
                <el-date-picker
                  v-model="form.fBsdate"
                  type="date"
                  size="small"
                  style="width: 100%"
                  :disabled="modify"
                  placeholder="选择日期"
                  format="yyyy-MM-dd"
                >
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="起运港运输条款" prop="fServiceitems">
                <el-select
                  v-model="form.fServiceitems"
                  :disabled="modify"
                  size="small"
                  style="width: 100%"
                >
                  <el-option
                    v-for="dict in transport"
                    :key="dict.dictValue"
                    :label="dict.dictLabel"
                    :value="dict.dictValue"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="目的港运输条款" prop="fServiceitemsNew">
                <el-select
                  v-model="form.fServiceitemsNew"
                  :disabled="modify"
                  size="small"
                  style="width: 100%"
                >
                  <el-option
                    v-for="dict in fServiceitemsNews"
                    :key="dict.dictValue"
                    :label="dict.dictLabel"
                    :value="dict.dictValue"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
               </el-row>
               <el-row>
            <el-col :span="6">
              <el-form-item label="付款方式" prop="fPaymode">
                <el-select
                  v-model="form.fPaymode"
                  :disabled="modify"
                  size="small"
                  style="width: 100%"
                >
                  <el-option
                    v-for="dict in paymentMethod"
                    :key="dict.dictValue"
                    :label="dict.dictLabel"
                    :value="dict.dictValue"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="售票方" prop="fInvoceobj">
                <el-select
                  v-model="form.fInvoceobj"
                  :disabled="modify"
                  size="small"
                  style="width: 100%"
                >
                  <el-option
                    v-for="dict in drawee"
                    :key="dict.dictValue"
                    :label="dict.dictLabel"
                    :value="dict.dictValue"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="箱内签收单" prop="fSign">
                <el-select
                  v-model="form.fSign"
                  :disabled="modify"
                  size="small"
                  style="width: 100%"
                >
                  <el-option
                    v-for="dict in cEsign"
                    :key="dict.dictValue"
                    :label="dict.dictLabel"
                    :value="dict.dictValue"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="订舱人扣货" prop="fDetentioncargo">
                <el-select
                  v-model="form.fDetentioncargo"
                  :disabled="modify"
                  style="width: 100%"
                  size="small"
                >
                  <el-option
                    v-for="dict in etentioncargo"
                    :key="dict.dictValue"
                    :label="dict.dictLabel"
                    :value="dict.dictValue"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="船名" prop="vslid">
                <el-select
                  v-model="form.fVslid"
                  filterable
                  remote
                  style="width: 100%"
                  :disabled="modify"
                  class="elSelect"
                  placeholder="请输入模糊查找目的船名"
                >
                  <el-scrollbar>
                    <el-option
                      v-for="dict in vslidList"
                      :key="dict.fId"
                      :label="dict.fName"
                      :value="dict.fId"
                    ></el-option>
                  </el-scrollbar>
                </el-select>
              </el-form-item>
            </el-col>

            <el-col :span="6">
              <el-form-item label="航次" prop="voyidName">
                <el-select
                  v-model="form.fVoyid"
                  filterable
                  remote
                  style="width: 100%"
                  :disabled="modify"
                  class="elSelect"
                  placeholder="请输入模糊查找目的船名"
                >
                  <el-scrollbar>
                    <el-option
                      v-for="dict in voyidList"
                      :key="dict.fId"
                      :label="dict.fNo"
                      :value="dict.fId"
                    ></el-option>
                  </el-scrollbar>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="航线" prop="fLaneid">
                <el-select
                  v-model="form.fLaneid"
                  filterable
                  remote
                  style="width: 100%"
                  :disabled="modify"
                  placeholder="请选择航线"
                >
                  <el-scrollbar>
                    <el-option
                      v-for="dict in fLaneList"
                      :key="dict.fId"
                      :label="dict.fName"
                      :value="dict.fId"
                    ></el-option>
                  </el-scrollbar>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="14">
              <el-form-item label="备注" prop="remarks">
                <el-input
                  v-model="form.remark"
                  :disabled="modify"
                  size="small"
                  style="width: 75%"
                >
                </el-input>
                <el-button type="primary" size="small" @click="check(1)"
                  >查看</el-button
                >
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </el-collapse-item>
      <el-collapse-item title="预计时间" name="2">
        <el-form v-model="estimatedTime" label-width="130px" size="mini">
          <el-row>
            <el-col :span="6">
              <el-form-item label="起运港口" prop="portofloadidName">
                <el-input
                  v-model="estimatedTime.portofloadidName"
                  :disabled="doNot"
                  size="small"
                  style="width: 100%"
                />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="中转港口" prop="portoftransshipmentName">
                <el-input
                  v-model="estimatedTime.portoftransshipmentName"
                  :disabled="doNot"
                  size="small"
                  style="width: 100%"
                />
              </el-form-item>
            </el-col>
            <!--            <el-col :span="6">-->
            <!--              <el-form-item label="预计中转抵港日期" prop="fMblno">-->
            <!--                <el-input-->
            <!--                  v-model="form.fMblno"-->
            <!--                  :disabled="modify"-->
            <!--                  size="small"-->
            <!--                  style="width: 100%"-->
            <!--                  placeholder="手工输入"-->
            <!--                />-->
            <!--              </el-form-item>-->
            <!--            </el-col>-->
            <!--            <el-col :span="6">-->
            <!--              <el-form-item label="预计中转开航日期" prop="fMblno">-->
            <!--                <el-input-->
            <!--                  v-model="form.fMblno"-->
            <!--                  :disabled="modify"-->
            <!--                  size="small"-->
            <!--                  style="width: 100%"-->
            <!--                  placeholder="手工输入"-->
            <!--                />-->
            <!--              </el-form-item>-->
            <!--            </el-col>-->
            <el-col :span="6">
              <el-form-item label="目的港口" prop="distinationidName">
                <el-input
                  v-model="estimatedTime.distinationidName"
                  :disabled="doNot"
                  size="small"
                  style="width: 100%"
                />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="预计开航日期" prop="fEtd">
                <el-input
                  v-model="estimatedTime.fEtd"
                  :disabled="doNot"
                  size="small"
                  style="width: 100%"
                />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="预计抵港日期" prop="fEta">
                <el-input
                  v-model="estimatedTime.fEta"
                  :disabled="doNot"
                  size="small"
                  style="width: 100%"
                />
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </el-collapse-item>
      <el-collapse-item title="收发货人信息" name="3">
        <el-form v-model="form" label-width="130px" size="mini">
          <el-row>
            <el-col :span="6">
              <el-form-item label="发货人公司全称" prop="fShippername">
                <el-input
                  v-model="form.fShippername"
                  :disabled="modify"
                  size="small"
                  style="width: 100%"
                  placeholder="手工输入"
                />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="发货人详细地址" prop="fShipperattn">
                <el-input
                  v-model="form.fShipperattn"
                  :disabled="modify"
                  style="width: 100%"
                  size="small"
                  placeholder="手工输入"
                />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="发货人姓名和电话" prop="fShippertel">
                <el-input
                  v-model="form.fShippertel"
                  :disabled="modify"
                  size="small"
                  style="width: 100%"
                  placeholder="手工输入"
                />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="6">
              <el-form-item label="收货人公司全称" prop="fConsigneername">
                <el-input
                  v-model="form.fConsigneername"
                  :disabled="modify"
                  size="small"
                  style="width: 100%"
                  placeholder="手工输入"
                />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="收货人详细地址" prop="fConsigneeattn">
                <el-input
                  v-model="form.fConsigneeattn"
                  :disabled="modify"
                  style="width: 100%"
                  size="small"
                  placeholder="手工输入"
                />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="收货人姓名和电话" prop="fConsigneetel">
                <el-input
                  v-model="form.fConsigneetel"
                  :disabled="modify"
                  style="width: 100%"
                  size="small"
                  placeholder="手工输入"
                />
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </el-collapse-item>
      <el-collapse-item title="费用信息" name="5" class="minHeight">
        <el-form v-model="form" label-width="130px" size="mini">
          <el-row>
            <el-col :span="6">
              <el-form-item label="是否办理保险" prop="fInsurance">
                <el-select
                  v-model="form.fInsurance"
                  :disabled="modify"
                  size="small"
                  style="width: 100%"
                >
                  <el-option
                    v-for="dict in insurance"
                    :key="dict.dictValue"
                    :label="dict.dictLabel"
                    :value="dict.dictValue"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="保险货值（万元）" prop="fInsuranceamt">
                <el-input
                  v-model="form.fInsuranceamt"
                  :disabled="modify"
                  style="width: 100%"
                  size="small"
                />
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </el-collapse-item>
      <el-collapse-item title="货物信息" name="4">
        <el-table :data="goodsList" style="width: 100%" align="center">
          <el-table-column label="行号" type="index" min-width="100px" />
          <el-table-column label="货物名称" prop="fGoodsid" min-width="100px">
            <template slot-scope="scope">
              <el-select
                v-model="scope.row.fGoodsid"
                @change="selectChange(scope)"
                :disabled="modify"
              >
                <el-option
                  v-for="(item, index) in goods"
                  :key="index"
                  :label="item.fName"
                  :value="item.fId"
                />
              </el-select>
            </template>
          </el-table-column>
          <el-table-column label="货类" prop="typeidName" min-width="100px">
            <template slot-scope="scope">
              <el-input
                v-model="scope.row.typeidName"
                :disabled="modify"
              ></el-input>
            </template>
          </el-table-column>
          <el-table-column label="包装类型" prop="fPackageid" min-width="100px">
            <template slot-scope="scope">
              <el-select v-model="scope.row.fPackageid" :disabled="modify">
                <el-option
                  v-for="item in packgeOptions"
                  :key="item.dictValue"
                  :label="item.dictLabel"
                  :value="item.dictValue"
                />
              </el-select>
            </template>
          </el-table-column>
          <el-table-column label="箱型" prop="fCntrid" min-width="100px">
            <template slot-scope="scope">
              <el-select
                v-model="scope.row.fCntrid"
                @change="seleEt(scope)"
                :disabled="modify"
              >
                <el-option
                  v-for="item in cntrOptions"
                  :key="item.fId"
                  :label="item.fNo"
                  :value="item.fId"
                />
              </el-select>
            </template>
          </el-table-column>
          <el-table-column label="箱量" prop="fCntrcount" min-width="100px">
            <template slot-scope="scope">
              <el-input
                v-model="scope.row.fCntrcount"
                :disabled="modify"
                :maxlength="3"
                oninput='this.value=this.value.replace(/[^\d.]/g,"")'
              ></el-input>
            </template>
          </el-table-column>
          <el-table-column
            label="单箱重量（吨）"
            prop="fCntrweight"
            min-width="120px"
          >
            <template slot-scope="scope">
              <el-input
                v-model="scope.row.fCntrweight"
                :disabled="modify"
                @input="cntrWeight"
              ></el-input>
            </template>
          </el-table-column>
          <el-table-column label="箱态" prop="fCntrstatus" min-width="100px">
            <template slot-scope="scope">
              <el-select v-model="scope.row.fCntrstatus" :disabled="modify">
                <el-option
                  v-for="item in fStatus"
                  :key="item.dictValue"
                  :label="item.dictLabel"
                  :value="item.dictValue"
                />
              </el-select>
            </template>
          </el-table-column>
          <el-table-column label="自备货柜" prop="fSoc" min-width="100px">
            <template slot-scope="scope">
              <el-select v-model="scope.row.fSoc" :disabled="modify">
                <el-option label="是" value="0"></el-option>
                <el-option label="否" value="1"></el-option>
              </el-select>
            </template>
          </el-table-column>
          <div v-if="whether === true">
            <el-table-column
              label="设置温度（℃）"
              prop="fTemperature"
              min-width="120px"
            >
              <template slot-scope="scope">
                <el-input
                  v-model="scope.row.fTemperature"
                  :disabled="modify"
                  @input="temperature"
                  oninput='this.value=this.value.replace(/[^\-?\d.]/g,"")'
                ></el-input>
              </template>
            </el-table-column>
            <el-table-column
              label="风门开度（%）"
              prop="fDraught"
              min-width="120px"
            >
              <template slot-scope="scope">
                <el-input
                  v-model="scope.row.fDraught"
                  :disabled="modify"
                  @input="throttleOpening"
                  oninput='this.value=this.value.replace(/[^\d.]/g,"")'
                ></el-input>
              </template>
            </el-table-column>
            <el-table-column
              label="湿度设置（%）"
              prop="fHumidity"
              min-width="120px"
            >
              <template slot-scope="scope">
                <el-input
                  v-model="scope.row.fHumidity"
                  :disabled="modify"
                  @input="throttleOpening"
                  oninput='this.value=this.value.replace(/[^\d.]/g,"")'
                ></el-input>
              </template>
            </el-table-column>
            <el-table-column
              label="预冷要求"
              prop="fPrecooling"
              min-width="100px"
            >
              <template slot-scope="scope">
                <el-select v-model="scope.row.fPrecooling" :disabled="modify">
                  <el-option label="是" value="1"></el-option>
                  <el-option label="否" value="2"></el-option>
                </el-select>
              </template>
            </el-table-column>
          </div>
          <el-table-column
            label="是否危险品"
            prop="ifdangerName"
            min-width="100px"
          >
            <template slot-scope="scope">
              <span>{{ scope.row.ifdangerName }}</span>
              <el-button
                type="primary"
                size="small"
                @click="check(2)"
                style="margin-left: 5px"
                >查看</el-button
              >
            </template>
          </el-table-column>
          <el-table-column label="备注" prop="remark" min-width="100px" />
        </el-table>
      </el-collapse-item>
      <el-collapse-item title="箱信息" name="6" class="minHeight">
        <div
          class="dialogTableTitle flex a-center jlr"
          style="
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin: 10px 0;
            font-size: 16px;
            font-weight: bolder;
          "
        >
          <div>
            <el-button
              size="small"
              type="primary"
              :disabled="modify"
              @click.prevent="addList()"
              >新行
            </el-button>
            <!-- <el-button :disabled="browseStatus" @click.prevent="deleteRow(warehouseDrList)"
            >删除
          </el-button> -->
            <el-button
              type="primary"
              size="small"
              :disabled="modify"
              @click="approval(1)"
              >保 存
            </el-button>
            <el-button
              type="danger"
              size="small"
              :disabled="selection.length === 0"
              @click="deleteAll"
              v-if="form.fCargoPlanning == 1"
              >批量删除</el-button
            >
            <el-button
              type="warning"
              size="small"
              @click="dialogPrint"
              :disabled="dataList.length === 0"
              >打印运单</el-button
            >
            <el-upload
              class="upload-demo"
              :action="baseURL"
              :headers="headers"
              :on-progress="uploading"
              :show-file-list="false"
              :data="{
                fId: goodsList[0].fId,
              }"
              :on-success="importTemplate"
              accept=".xls,.xlsx"
              :disabled="modify"
              multiple
              style="float: right; margin-right: 20px"
            >
              <el-button
                size="small"
                style="margin-left: 5px"
                type="warning"
                :disabled="modify"
                >导入</el-button
              >
            </el-upload>
          </div>
        </div>
        <el-table
          :data="dataList"
          style="width: 100%"
          @selection-change="Selectinventory"
        >
          <el-table-column type="selection" width="55" align="center" />
          <el-table-column label="序号" type="index" width="80" />
          <el-table-column label="箱号" align="center" prop="fCntrno">
            <template slot-scope="scope">
              <el-input v-model="scope.row.fCntrno" :disabled="modify" />
            </template>
          </el-table-column>
          <el-table-column label="铅封号" align="center" prop="fSealno">
            <template slot-scope="scope">
              <el-input v-model="scope.row.fSealno" :disabled="modify" />
            </template>
          </el-table-column>
          <el-table-column
            prop="fCntrweight"
            label="单箱重量（吨）"
            align="center"
          >
            <template slot-scope="scope">
              <el-input
                v-model="scope.row.fCntrweight"
                :disabled="modify"
                @input="cntrWeight"
              />
            </template>
          </el-table-column>
          <el-table-column prop="fGoodsid" label="货名" align="center">
            <template slot-scope="scope">
              <el-select
                clearable
                v-model="scope.row.fGoodsid"
                :disabled="modify"
              >
                <el-option
                  v-for="item in goodsOptions"
                  :key="item.fId"
                  :label="item.fName"
                  :value="item.fId"
                />
              </el-select>
            </template>
          </el-table-column>
          <el-table-column prop="fPackageid" label="包装类型" align="center">
            <template slot-scope="scope">
              <el-select
                clearable
                v-model="scope.row.fPackageid"
                :disabled="modify"
              >
                <el-option
                  v-for="dict in packgeOptions"
                  :key="dict.dictValue"
                  :label="dict.dictLabel"
                  :value="dict.dictValue"
                />
              </el-select>
            </template>
          </el-table-column>
          <el-table-column prop="fCntrid" label="箱型" align="center">
            <template slot-scope="scope">
              <el-select
                clearable
                v-model="scope.row.fCntrid"
                :disabled="modify"
              >
                <el-option
                  v-for="item in cntrOptions"
                  :key="item.fId"
                  :label="item.fNo"
                  :value="item.fId"
                />
              </el-select>
            </template>
          </el-table-column>
          <!--          <el-table-column prop="fManual" label="来源" align="center">-->

          <!--            <template slot-scope="scope">-->
          <!--              <el-select clearable v-model="scope.row.fManual" :disabled="modify">-->
          <!--                <el-option />-->
          <!--              </el-select>-->
          <!--            </template>-->
          <!--          </el-table-column>-->
          <el-table-column prop="address" label="操作" align="center">
            <template slot-scope="scope">
              <el-button
                size="small"
                :disabled="modify"
                @click="deleteRow(scope.$index, dataList)"
                >移除
              </el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-collapse-item>
      <el-collapse-item name="7">
        <template slot="title">
          <i class="el-icon-circle-plus"></i>应收费用
        </template>
        <div
          class="dialogTableTitle flex a-center jlr"
          style="
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin: 10px 0;
          "
        >
          <div>
            <el-button
              size="small"
              type="primary"
              :disabled="modify"
              @click.prevent="addCollection()"
              >新行
            </el-button>
            <!-- <el-button :disabled="browseStatus" @click.prevent="deleteRow(warehouseDrList)"
            >删除
          </el-button> -->
            <el-button
              type="primary"
              size="small"
              :disabled="modify"
              @click="approval(1)"
              >保 存
            </el-button>
            <!-- <el-button @click.prevent="addAgreement()" type="warning">仓储费协议</el-button> -->
            <el-button
              size="small"
              @click.prevent="handleSelect('收费')"
              :disabled="modify"
              type="danger"
              >导入协议
            </el-button>
            <el-button
              type="primary"
              size="small"
              @click="feeChange('D')"
            >费用变更</el-button>
          </div>
        </div>
        <el-table
          :data="warehouseDrList"
          ref="table"
          tooltip-effect="dark"
          border
          stripe
          show-summary
          :summary-method="warehouseDrSummaries"
        >
          <el-table-column type="selection" width="55" align="center" />
          <el-table-column label="序号" type="index" width="80">
          </el-table-column>
          <el-table-column
            prop="fBusinessType"
            header-align="center"
            align="center"
            width="180px"
            label="业务类型"
          >
            <template slot-scope="scope">
              <el-select
                v-model="scope.row.fBusinessType"
                filterable
                remote
                :disabled="modify"
                placeholder="请选择业务类型"
              >
                <el-option
                  v-for="dict in businessTypeOptions"
                  :key="dict.dictValue"
                  :label="dict.dictLabel"
                  :value="dict.dictValue"
                ></el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column
            prop="fCorpid"
            header-align="center"
            align="center"
            width="180px"
            label="客户名称"
          >
            <template slot-scope="scope">
              <el-select
                v-model="scope.row.fCorpid"
                filterable
                remote
                :disabled="modify"
                placeholder="请选择客户名称"
              >
                <el-option
                  v-for="item in nameOptions"
                  :key="item.fId"
                  :label="item.fName"
                  :value="item.fId"
                ></el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column
            prop="fFeeid"
            header-align="center"
            align="center"
            width="180px"
            label="费用名称"
          >
            <template slot-scope="scope">
              <el-select
                v-model="scope.row.fFeeid"
                filterable
                remote
                :disabled="modify"
                placeholder="请选择费用名称"
              >
                <el-option
                  v-for="(dict, index) in fDNameOptions"
                  :key="index.fId"
                  :label="dict.fName"
                  :value="dict.fId"
                ></el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column
            prop="fFeeUnitid"
            header-align="center"
            align="center"
            width="180px"
            label="计价单位"
          >
            <template slot-scope="scope">
              <el-select
                v-model="scope.row.fFeeUnitid"
                placeholder="请选择计价单位"
                @change="changeFeeUnit(scope.row)"
                clearable
                :disabled="modify"
              >
                <el-option
                  v-for="(dict, index) in jFeetunitOptions"
                  :key="index.dictValue"
                  :label="dict.dictLabel"
                  :value="dict.dictValue"
                />
              </el-select>
            </template>
          </el-table-column>
          <el-table-column
            prop="fQty"
            header-align="center"
            align="center"
            width="130px"
            label="数量"
          >
            <template slot-scope="scope">
              <el-input
                oninput='this.value=this.value.replace(/[^\-?\d.]/g,"").replace(/^(\-)*(\d+)\.(\d\d).*$/, "$1$2.$3")'
                v-model="scope.row.fQty"
                placeholder="数量"
                :disabled="modify"
                @change="changeContractAmt(scope.row)"
                show-word-limit
              />
            </template>
          </el-table-column>
          <el-table-column
            prop="fUnitprice"
            header-align="center"
            align="center"
            width="130px"
            label="单价"
          >
            <template slot-scope="scope">
              <el-input
                oninput='this.value=this.value.replace(/[^\-?\d.]/g,"").replace(/^(\-)*(\d+)\.(\d\d).*$/, "$1$2.$3")'
                v-model="scope.row.fUnitprice"
                placeholder="单价"
                :disabled="modify"
                @change="changeContractAmt(scope.row)"
                show-word-limit
              />
            </template>
          </el-table-column>
          <el-table-column
            prop="fAmount"
            header-align="center"
            align="center"
            width="130px"
            label="金额"
          >
            <template slot-scope="scope">
              <el-input
                disabled
                oninput='this.value=this.value.replace(/[^\-?\d.]/g,"").replace(/^(\-)*(\d+)\.(\d\d).*$/, "$1$2.$3")'
                v-model="scope.row.fAmount"
                placeholder="金额"
                show-word-limit
              />
            </template>
          </el-table-column>
          <el-table-column
            prop="fStltypeid"
            header-align="center"
            align="center"
            width="130px"
            label="结算方式"
          >
            <template slot-scope="scope">
              <el-select
                v-model="scope.row.fStltypeid"
                placeholder="请选择结算表票结、月结"
                :disabled="modify"
              >
                <el-option
                  v-for="(dict, index) in fStltypeOptions"
                  :key="index.dictValue"
                  :label="dict.dictLabel"
                  :value="parseInt(dict.dictValue)"
                ></el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column
            prop="fCurrency"
            header-align="center"
            align="center"
            width="130px"
            label="币别"
          >
            <template slot-scope="scope">
              <el-input
                v-model="scope.row.fCurrency"
                :disabled="modify"
                placeholder="币别"
                show-word-limit
              />
            </template>
          </el-table-column>
          <el-table-column
            prop="fExrate"
            header-align="center"
            align="center"
            width="130px"
            label="汇率"
          >
            <template slot-scope="scope">
              <el-input
                v-model="scope.row.fExrate"
                :disabled="modify"
                placeholder="汇率"
                show-word-limit
              />
            </template>
          </el-table-column>
          <el-table-column
            prop="fTaxrate"
            header-align="center"
            align="center"
            width="130px"
            label="税率"
          >
            <template slot-scope="scope">
              <el-input
                v-model="scope.row.fTaxrate"
                :disabled="modify"
                placeholder="税率"
                show-word-limit
              />
            </template>
          </el-table-column>
          <el-table-column
            prop="fSrcTypeId"
            header-align="center"
            align="center"
            width="130px"
            label="来源"
          >
            <template slot-scope="scope">
              <span v-if="scope.row.fSrcTypeId === 0">录入</span>
              <span v-if="scope.row.fSrcTypeId === 1">协议</span>
              <span v-if="scope.row.fSrcTypeId === 2">订舱</span>
              <span v-if="scope.row.fSrcTypeId == 10">变更</span>
            </template>
          </el-table-column>

          <el-table-column
            prop="remark"
            header-align="center"
            align="center"
            width="150px"
            label="备注"
          >
            <template slot-scope="scope">
              <el-input
                v-model="scope.row.remark"
                :disabled="modify"
                placeholder="备注"
                show-word-limit
              />
            </template>
          </el-table-column>
          <el-table-column
            header-align="center"
            align="center"
            label="操作"
            width="200px"
          >
            <template slot-scope="scope">
              <el-button
                @click.native.prevent="deleteRow(scope.$index, warehouseDrList)"
                size="small"
                :disabled="modify"
                >移除
              </el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-collapse-item>
      <el-collapse-item name="8">
        <template slot="title">
          <i class="el-icon-remove"></i>应付费用
        </template>
        <div
          class="dialogTableTitle flex a-center jlr"
          style="
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin: 10px 0;
          "
        >
          <div>
            <el-button
              type="primary"
              :disabled="modify"
              @click.prevent="addpayment()"
              size="small"
              >新行
            </el-button>
            <el-button
              type="primary"
              size="small"
              @click="approval(1)"
              :disabled="modify"
              >保 存
            </el-button>
            <el-button
              type="danger"
              size="small"
              @click.prevent="handleSelect('付费')"
              :disabled="modify"
              >导入协议
            </el-button>
            <el-button
              type="primary"
              size="small"
              @click="feeChange('C')"
            >费用变更</el-button>
          </div>
        </div>
        <el-table
          :data="warehouseCrList"
          ref="table"
          tooltip-effect="dark"
          border
          stripe
          show-summary
          :summary-method="warehouseCrSummaries"
        >
          <el-table-column type="selection" width="55" align="center" />
          <el-table-column label="序号" type="index" width="80">
          </el-table-column>
          <el-table-column
            prop="fCorpid"
            header-align="center"
            align="center"
            width="180px"
            label="业务类型"
          >
            <template slot-scope="scope">
              <el-select
                v-model="scope.row.fBusinessType"
                filterable
                remote
                :disabled="modify || scope.row.fSrcTypeId != 0"
                placeholder="请选择业务类型"
              >
                <el-option
                  v-for="dict in businessTypeOptions"
                  :key="dict.dictValue"
                  :label="dict.dictLabel"
                  :value="dict.dictValue"
                ></el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column
            prop="fCorpid"
            header-align="center"
            align="center"
            width="180px"
            label="客户名称"
          >
            <template slot-scope="scope">
              <el-select
                v-model="scope.row.fCorpid"
                filterable
                remote
                :disabled="modify || scope.row.fSrcTypeId != 0"
                placeholder="请选择客户名称"
              >
                <el-option
                  v-for="item in nameOptions"
                  :key="item.fId"
                  :label="item.fName"
                  :value="item.fId"
                ></el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column
            prop="fFeeid"
            header-align="center"
            align="center"
            width="180px"
            label="费用名称"
          >
            <template slot-scope="scope">
              <el-select
                v-model="scope.row.fFeeid"
                filterable
                :disabled="modify || scope.row.fSrcTypeId !== 0"
                remote
                placeholder="请选择费用名称"
              >
                <el-option
                  v-for="(dict, index) in fCNameOptions"
                  :key="index.fId"
                  :label="dict.fName"
                  :value="dict.fId"
                ></el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column
            prop="fFeeUnitid"
            header-align="center"
            align="center"
            width="180px"
            label="计价单位"
          >
            <template slot-scope="scope">
              <el-select
                v-model="scope.row.fFeeUnitid"
                filterable
                remote
                @change="changeFeeUnit(scope.row)"
                :disabled="modify || scope.row.fSrcTypeId !== 0"
                placeholder="请选择计价单位"
              >
                <el-option
                  v-for="(dict, index) in jFeetunitOptions"
                  :key="index.dictValue"
                  :label="dict.dictLabel"
                  :value="dict.dictValue"
                ></el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column
            prop="fQty"
            header-align="center"
            align="center"
            width="150px"
            label="数量"
          >
            <template slot-scope="scope">
              <el-input
                oninput='this.value=this.value.replace(/[^\-?\d.]/g,"").replace(/^(\-)*(\d+)\.(\d\d\d\d).*$/, "$1$2.$3")'
                v-model="scope.row.fQty"
                :disabled="modify || scope.row.fSrcTypeId !== 0"
                @change="changeContractAmt(scope.row)"
                placeholder="数量"
                show-word-limit
              />
            </template>
          </el-table-column>
          <el-table-column
            prop="fUnitprice"
            header-align="center"
            align="center"
            width="150px"
            label="单价"
          >
            <template slot-scope="scope">
              <el-input
                oninput='this.value=this.value.replace(/[^\-?\d.]/g,"").replace(/^(\-)*(\d+)\.(\d\d).*$/, "$1$2.$3")'
                v-model="scope.row.fUnitprice"
                :disabled="modify || scope.row.fSrcTypeId !== 0"
                @change="changeContractAmt(scope.row)"
                placeholder="单价"
                show-word-limit
              />
            </template>
          </el-table-column>
          <el-table-column
            prop="fAmount"
            header-align="center"
            align="center"
            width="150px"
            label="金额"
          >
            <template slot-scope="scope">
              <el-input
                disabled
                oninput='this.value=this.value.replace(/[^\-?\d.]/g,"").replace(/^(\-)*(\d+)\.(\d\d).*$/, "$1$2.$3")'
                v-model="scope.row.fAmount"
                placeholder="金额"
                show-word-limit
              />
            </template>
          </el-table-column>
          <el-table-column
            prop="fStltypeid"
            header-align="center"
            align="center"
            width="130px"
            label="结算方式"
          >
            <template slot-scope="scope">
              <el-select
                v-model="scope.row.fStltypeid"
                placeholder="请选择结算表票结、月结"
                :disabled="modify || scope.row.fSrcTypeId !== 0"
              >
                <el-option
                  v-for="(dict, index) in fStltypeOptions"
                  :key="index.dictValue"
                  :label="dict.dictLabel"
                  :value="parseInt(dict.dictValue)"
                ></el-option>
              </el-select>
            </template>
          </el-table-column>

          <el-table-column
            prop="fCurrency"
            header-align="center"
            align="center"
            width="150px"
            label="币别"
          >
            <template slot-scope="scope">
              <el-input
                v-model="scope.row.fCurrency"
                :disabled="modify || scope.row.fSrcTypeId !== 0"
                placeholder="币别"
                show-word-limit
              />
            </template>
          </el-table-column>
          <el-table-column
            prop="fExrate"
            header-align="center"
            align="center"
            width="150px"
            label="汇率"
          >
            <template slot-scope="scope">
              <el-input
                v-model="scope.row.fExrate"
                :disabled="modify || scope.row.fSrcTypeId !== 0"
                placeholder="汇率"
                show-word-limit
              />
            </template>
          </el-table-column>
          <el-table-column
            prop="fTaxrate"
            header-align="center"
            align="center"
            width="150px"
            label="税率"
          >
            <template slot-scope="scope">
              <el-input
                v-model="scope.row.fTaxrate"
                :disabled="modify || scope.row.fSrcTypeId !== 0"
                placeholder="税率"
                show-word-limit
              />
            </template>
          </el-table-column>
          <el-table-column
            prop="fSrcTypeId"
            header-align="center"
            align="center"
            width="130px"
            label="来源"
          >
            <template slot-scope="scope">
              <span v-if="scope.row.fSrcTypeId === 0">录入</span>
              <span v-if="scope.row.fSrcTypeId === 1">协议</span>
              <span v-if="scope.row.fSrcTypeId === 2">订舱</span>
              <span v-if="scope.row.fSrcTypeId == 10">变更</span>
            </template>
          </el-table-column>
          <el-table-column
            prop="remark"
            header-align="center"
            align="center"
            width="150px"
            label="备注"
          >
            <template slot-scope="scope">
              <el-input
                v-model="scope.row.remark"
                :disabled="modify || scope.row.fSrcTypeId !== 0"
                placeholder="备注"
                show-word-limit
              />
            </template>
          </el-table-column>
          <el-table-column
            header-align="center"
            align="center"
            width="200px"
            label="操作"
          >
            <template slot-scope="scope">
              <!--               <el-button size="small">审核费用</el-button> -->
              <el-button
                @click.native.prevent="deleteRow(scope.$index, warehouseCrList)"
                size="small"
                :disabled="modify"
                >移除
              </el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-collapse-item>
      <el-collapse-item name="9" class="minHeight" title="箱信息">
        <template slot="title">
          <i class="el-icon-circle-plus"></i>利润合计：
          {{
            this.amountDr != null && this.amountCr != null
              ? this.amountDr - this.amountCr
              : !this.amountDr && this.amountCr
              ? 0 - this.amountCr
              : !this.amountDr && !this.amountCr
              ? ""
              : this.amountDr
          }}
        </template>
      </el-collapse-item>
    </el-collapse>

    <div style="margin: 60px; float: right">
      <add-or-update
        v-if="addOrUpdateVisible"
        ref="addOrUpdate"
        @refreshDataList="getDataList"
      ></add-or-update>
      <approval-comments
        v-if="addOrUpdateVisib"
        ref="ApprovalComments"
        @refreshDataList="returnData"
      ></approval-comments>
      <el-button
        type="info"
        :disabled="jumpDonot"
        v-if="form.fBillstatus <= 11 && form.fBillstatus >= 6"
        @click="modify = false"
        >修 改
      </el-button>
      <el-button
        type="success"
        :disabled="modify"
        v-if="form.fBillstatus <= 11 || form.fBillstatus >= 6"
        @click="approval(1)"
        >保 存
      </el-button>
      <el-button
        type="primary"
        :disabled="modify"
        v-if="form.fBillstatus == 11 && this.form.moneyStatus < 4"
        @click="feeSubmission"
        v-loading="auditLoading"
        >费用请核
      </el-button>
      <el-button
        type="primary"
        v-if="form.fBillstatus == 11 && this.form.moneyStatus >= 4"
        @click="revokeSubmission"
        v-loading="auditLoading"
        v-hasPermi="['warehouseBusiness:revoke']"
      >
        撤销费用请核
      </el-button>
      <el-button
        type="success"
        v-if="approVal"
        @click="addOrUpdateHand(form, 'f_billstatus')"
        >审 批</el-button
      >
      <el-button
        type="primary"
        v-if="
          form.fUpdeteStatus >= 2 &&
          form.fUpdeteStatus <= 6 &&
          form.fSubmitUpdate >= 2 &&
          form.fSubmitUpdate <= 6 &&
          form.fDeleteStatus >= 2 &&
          form.fDeleteStatus <= 5 &&
          approvalTwo
        "
        @click="modifyApproval()"
        >审批
      </el-button>
      <el-button
        v-if="!form.fMblno && form.fBillstatus < 5"
        type="danger"
        @click="rejectDeletion"
      >
        驳回并删除
      </el-button>
      <el-button
        type="danger"
        :disabled="disappear"
        v-if="form.moneyStatus === 4 && current == before"
        @click="revokeTwo('f_billstatus')"
        v-hasPermi="['warehouseBusiness:revoke']"
        >撤销请核
      </el-button>
      <el-button
        type="primary"
        v-if="
          form.fUpdeteStatus !== 4 &&
          form.fUpdeteStatus !== 5 &&
          form.fUpdeteStatus !== 6 &&
          (form.fBillstatus !== 11 ||
            form.moneyStatus == 1 ||
            (form.moneyStatus != null && form.moneyStatus >= 4))
        "
        @click="addOrUpdateHandle('f_billstatus')"
        >查看审批
      </el-button>
      <el-button
        type="primary"
        v-if="
          form.fUpdeteStatus >= 2 &&
          form.fUpdeteStatus <= 6 &&
          form.fSubmitUpdate >= 2 &&
          form.fSubmitUpdate <= 6 &&
          form.fDeleteStatus >= 2 &&
          form.fDeleteStatus <= 5 &&
          dataElist
        "
        @click="revisionApproval()"
        >查看审批
      </el-button>
      <el-button
        icon="el-icon-arrow-left"
        type="danger"
        v-if="cancelButton === true"
        @click="cancel"
        >返回列表</el-button
      >
      <el-button
        icon="el-icon-arrow-left"
        type="danger"
        v-if="cancelButton === false"
        @click="cancelTwo"
        >返回首页
      </el-button>
    </div>
    <!--    附件查看-->
    <el-dialog
      title="查看附件"
      :visible.sync="dialogVisible"
      width="60%"
      v-dialogDrag
    >
      <el-table
        :data="relevantAttachments"
        ref="table"
        tooltip-effect="dark"
        border
        stripe
        style="width: 100%"
        height="150"
      >
        <el-table-column label="序号" type="index" width="80">
        </el-table-column>
        <el-table-column
          prop="fName"
          header-align="center"
          align="center"
          width="250px"
          label="附件名称"
        >
          <template slot-scope="scope">
            <el-input
              v-model="scope.row.fName"
              placeholder="附件名称"
              show-word-limit
            />
          </template>
        </el-table-column>
        <el-table-column
          prop="createTime"
          header-align="center"
          align="center"
          width="250px"
          label="上传时间"
        >
          <template slot-scope="scope">
            <el-input
              v-model="scope.row.createTime"
              disabled
              placeholder="上传时间"
            ></el-input>
          </template>
        </el-table-column>
        <el-table-column
          prop="createBy"
          header-align="center"
          align="center"
          width="150px"
          label="上传人"
        >
          <template slot-scope="scope">
            <el-input
              v-model="scope.row.createBy"
              disabled
              placeholder="上传人"
              show-word-limit
            />
          </template>
        </el-table-column>
        <el-table-column
          prop="fUrl"
          header-align="center"
          align="center"
          width="150px"
          label="操作"
        >
          <template slot-scope="scope">
            <!--          <el-upload-->
            <!--            class="upload-demo"-->
            <!--            :action="uploadImgUrl"-->
            <!--            :on-success="(res,file)=>{handleSucces(scope,res,file)}"-->
            <!--            :headers="headers"-->
            <!--            style="width:25%;float: left"-->
            <!--            :show-file-list="false"-->
            <!--            :limit="1"-->
            <!--          >-->
            <!--            <el-button size="small" type="primary" style="margin-left:20px">点击上传</el-button>-->
            <!--          </el-upload>-->
            <el-button size="small" type="primary" @click="checkFile(scope)"
              >查看</el-button
            >
            <!--          <el-button size="small" type="primary" @click="deleteFile(scope)">删除</el-button>-->
          </template>
        </el-table-column>
      </el-table>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="dialogVisible = false"
          >确 定</el-button
        >
      </span>
    </el-dialog>
    <!--    打印运单-->
    <el-dialog
      :visible.sync="dialogPrinting"
      width="30%"
      append-to-body
      fullscreen
      :show-close="false"
      :close-on-press-escape="false"
      :before-close="(dialogVisible = false)"
    >
      <div ref="print" style="width: 99%; margin: 1px auto auto">
        <div style="width: 100%">
          <div
            style="
              width: 50%;
              height: 160px;
              float: left;
              justify-content: center;
              align-items: center;
              display: -webkit-flex;
            "
          >
            <div>
              <h1>青岛凯和志诚物流有限公司</h1>
              <h3 style="text-align: center">水路集装箱货物运单</h3>
            </div>
          </div>
          <div
            style="
              width: 50%;
              height: 160px;
              float: left;
              justify-content: center;
              align-items: center;
              display: -webkit-flex;
            "
          >
            <div style="width: 500px; border: 1px solid #cccccc; padding: 10px">
              <h4 style="margin: 0">
                1、本运单一式四联，第一联退回发货人或托运人，做为目的港收货人提货凭证。
              </h4>
              <h4 style="margin: 0">2、运单一经提取货物后即失去提货效力。</h4>
              <h4 style="margin: 0">
                3、运单非有价证券，不得流通或转让给非本运单指定的第三方。
              </h4>
              <h4 style="margin: 0">
                4、托运人必须投保货物运输综合险，否则由此产生的损失由托运人自负。
              </h4>
              <h4 style="margin: 0">
                5、船东过失承运人不承担责任，由过失方承担。
              </h4>
            </div>
          </div>
        </div>
        <div
          style="
            display: flex;
            justify-content: space-between;
            width: 61.3%;
            margin-left: 10px;
          "
        >
          <p>离港日:{{ estimatedTime.fEtd }}</p>
          <p>运单号:{{ form.fMblno }}</p>
          <p>
            运输条款:{{
              form.fServiceitems | fServiceitemsNameFormat(transport)
            }}
          </p>
          <p>
            箱型箱量:{{
              goodsList && goodsList.length > 0
                ? goodsList[0].cntrName + "*" + goodsList[0].fCntrcount
                : "—"
            }}
          </p>
          <p>业务号:{{ form.fBillno }}</p>
        </div>
        <table
          border="1"
          style="border-collapse: collapse; width: 100%; text-align: center"
        >
          <tr class="listTd">
            <td style="width: 9%">船名</td>
            <td style="width: 9%">
              {{ form.fVslid | fVslidFormat(vslidList) }}
            </td>
            <td style="width: 9%">航次</td>
            <td style="width: 11%" colspan="2">
              {{ form.fVoyid | voyidNameFormat(voyidList) }}
            </td>
            <td style="width: 9%">装货港</td>
            <td style="width: 9%">
              {{ form.fLoadportid | portFormat(fMblnoOptions) }}
            </td>
            <td style="width: 9%">卸货港</td>
            <td style="width: 11%" colspan="2">
              {{ form.fDestportid | portFormat(fMblnoOptions) }}
            </td>
            <td style="width: 12%" rowspan="4" colspan="2">卸货人日期(章)</td>
            <td style="width: 12%" rowspan="4" colspan="2">收货人(章)</td>
          </tr>
          <tr class="listTd">
            <td>第一接驳船</td>
            <td></td>
            <td>航次</td>
            <td colspan="2"></td>
            <td>第一换装港</td>
            <td colspan="4"></td>
          </tr>
          <tr class="listTd">
            <td>第二接驳船</td>
            <td></td>
            <td>航次</td>
            <td colspan="2"></td>
            <td>第二换装港</td>
            <td colspan="4"></td>
          </tr>
          <tr class="listTd">
            <td rowspan="3">托运人</td>
            <td>全称</td>
            <td rowspan="3" colspan="2">
              {{ form.fShippername
              }}{{ form.fShipperattn ? "," + form.fShipperattn : ""
              }}{{ form.fShippertel ? "," + form.fShippertel : "" }}
            </td>
            <td rowspan="3">收货人</td>
            <td>全称</td>
            <td colspan="4" rowspan="3">
              {{ form.fConsigneername
              }}{{ form.fConsigneeattn ? "," + form.fConsigneeattn : ""
              }}{{ form.fConsigneetel ? "," + form.fConsigneetel : "" }}
            </td>
          </tr>
          <tr class="listTd">
            <td>地址:电话</td>
            <td>地址:电话</td>
            <td rowspan="3" colspan="2">托运人(签盖)</td>
            <td rowspan="3" colspan="2">承运人(签盖)</td>
          </tr>
          <tr class="listTd">
            <td>银行:帐号</td>
            <td>银行:帐号</td>
          </tr>
          <tr class="listTd">
            <td rowspan="2" colspan="2">箱号</td>
            <td rowspan="2" colspan="2">铅封号</td>
            <td rowspan="2">批号</td>
            <td rowspan="2">货名</td>
            <td rowspan="2">箱型</td>
            <td rowspan="2">价值</td>
            <td rowspan="2">托运人确定重量(吨)</td>
            <td rowspan="2">计算重量(吨)</td>
          </tr>
          <tr>
            <td :rowspan="dataList.length + 2" align="center" colspan="4">
              <img
                src="../../../../assets/images/chapter.png"
                alt="无图片"
                style="width: 50%"
              />
            </td>
          </tr>
          <!--        此处为遍历列表-->
          <tr class="listTd" v-for="(item, index) in dataList" :key="index">
            <td colspan="2">{{ item.fCntrno }}</td>
            <td colspan="2">{{ item.fSealno }}</td>
            <td></td>
            <td>{{ item.fGoodsid | goodsFormat(goodsOptions) }}</td>
            <td>{{ item.fCntrid | cntrFormat(cntrOptions) }}</td>
            <td></td>
            <td></td>
            <td>{{ item.fCntrweight }}</td>
          </tr>
          <tr class="listTd">
            <td rowspan="5">托运人/发货人须知</td>
            <td colspan="4" rowspan="5" style="text-align: left; padding: 10px">
              1、粗线内各栏由发货人填写，如有更改时，须在更改处盖章；订舱委托书下条款及运单均为本运输合同组成部分，发货人已充分阅读并同意该部分条款。<br />2、按规定正确、清楚填写;并逐张盖上账号、公章，货名、件数、重量不得省略。由于申报不实给承运人、港口经营人造成损失的，托运人应当负赔偿责任；<br />3、托运人负责封箱，承运人对上述箱内货物的描述不知。<br />4、如超载引起事故，由装箱人负责；<br />5、为确保货物安全，货物装箱前请先验箱，无异议视为集装箱箱况完好；<br />6、严禁将危险货物、腐蚀箱体的货物及国家禁运货物装入箱内。<br />7、与本运单有关的任何争议，各方当事人一致同意选择由青岛海事法院管辖
            </td>
            <td rowspan="4">箱量合计：</td>
            <td rowspan="4"></td>
            <td rowspan="4">备注：</td>
            <td rowspan="4" colspan="2"></td>
          </tr>
          <tr></tr>
          <tr></tr>
          <tr></tr>
          <tr class="listTd">
            <td style="height: 40px">收费项目</td>
            <td>收费明细</td>
            <td></td>
            <td>收费金额</td>
            <td colspan="2"></td>
            <td colspan="2">预付/到付</td>
          </tr>
        </table>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogPrinting = false">取 消</el-button>
        <el-button type="primary" @click="Printing">打 印</el-button>
      </span>
    </el-dialog>
    <fee-dialog ref="feeDialog" @importFee="importFee" />
  </div>
</template>

<script>
import {
  listCorps,
  addmodify,
  getCntr,
  postApproval,
  listFees,
  getGoodName,
  getFName,
  getfee,
  getName,
  portInquiry,
  nameOfVessel,
  voyageNumber,
  reject,
  deleteAll,
  shippingList,
  cancellationFees,
  getfLaneName,
} from "@/api/kaihe/domesticTrade/orderInformation";
import Global from "@/layout/components/global";
import { getToken } from "@/utils/auth";
import Cookies from "js-cookie";
import draggable from "vuedraggable";
import Vue from "vue";
import AddOrUpdate from "@/views/viewApproval";
import ApprovalComments from "@/views/startApproval";
import { revoke, revokeTwo } from "@/api/warehouseBusiness/warehouseInStock";
import { queryUserVal } from "@/api/system/user";
import request from "@/utils/request";
import feeDialog from "./feeDialog";
Vue.directive("dialogDrag", {
  bind(el, binding, vnode, oldVnode) {
    const dialogHeaderEl = el.querySelector(".el-dialog__header");
    const dragDom = el.querySelector(".el-dialog");
    const enlarge = el.querySelector(".enlarge");
    dialogHeaderEl.style.cursor = "move";

    // 获取原有属性 ie dom元素.currentStyle 火狐谷歌 window.getComputedStyle(dom元素, null);
    const sty = dragDom.currentStyle || window.getComputedStyle(dragDom, null);
    if (enlarge) {
      enlarge.onclick = (e) => {
        dragDom.style.top = "0px";
        dragDom.style.left = "0px";
      };
    }
    dialogHeaderEl.onmousedown = (e) => {
      // 鼠标按下，计算当前元素距离可视区的距离
      const disX = e.clientX - dialogHeaderEl.offsetLeft;
      const disY = e.clientY - dialogHeaderEl.offsetTop;

      // 获取到的值带px 正则匹配替换
      let styL, styT;

      // 注意在ie中 第一次获取到的值为组件自带50% 移动之后赋值为px
      if (sty.left.includes("%")) {
        styL =
          +document.body.clientWidth * (+sty.left.replace(/\%/g, "") / 100);
        styT =
          +document.body.clientHeight * (+sty.top.replace(/\%/g, "") / 100);
      } else {
        styL = +sty.left.replace(/\px/g, "");
        styT = +sty.top.replace(/\px/g, "");
      }

      document.onmousemove = function (e) {
        // 通过事件委托，计算移动的距离
        const l = e.clientX - disX;
        const t = e.clientY - disY;

        // 移动当前元素

        if (t + styT >= 0) {
          dragDom.style.top = `${t + styT}px`;
        }
        dragDom.style.left = `${l + styL}px`;
        // 将此时的位置传出去
        // binding.value({x:e.pageX,y:e.pageY})
      };

      document.onmouseup = function (e) {
        document.onmousemove = null;
        document.onmouseup = null;
      };
    };
  },
});

export default {
  name: "orderInformation",
  components: {
    AddOrUpdate,
    ApprovalComments,
    feeDialog,
  },
  data() {
    return {
      auditLoading:false,
      selection: [],
      insurance: [],
      etentioncargo: [],
      vslidList: [],
      voyidList: [],
      fLaneList: [],
      cEsign: [],
      transport: [],
      fServiceitemsNews:[],
      paymentMethod: [],
      drawee: [],
      whether: false,
      fStatus: [],
      goods: [],
      rules: {
        fMblno: [{ required: true, message: " ", trigger: "blur" }],
      },
      changeNum: true,
      cancelButton: true,
      jumpDonot: false,
      disappear: false,
      businessTypeOptions: [],
      id: null,
      current: "",
      before: "",
      approVal: false,
      //客户名称下拉模糊
      nameOptions: [],
      //字典表包装类型
      packgeOptions: [],
      //货名下拉
      goodsOptions: [],
      //箱型下拉
      cntrOptions: [],
      fTaxrate: "",
      //结算方式
      fStltypeOptions: [],
      //计价单位
      jFeetunitOptions: [],
      //收付款费用名称字典表
      fDNameOptions: [],
      fCNameOptions: [],
      warehouseCrList: [],
      estimatedTime: {},
      addOrUpdateVisible: false,
      dataElist: false,
      addOrUpdateVisib: false,
      warehouseDrList: [],
      goodsList: [],
      dataList: [],
      visible: false,
      dataForm: {},
      modify: true,
      doNot: true,
      activeNames: ["1", "2", "3", "4", "5", "6"],
      form: {},
      fMblnoOptions: [],
      uploadImgUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 上传的图片服务器地址
      relevantAttachments: [],
      headers: { Authorization: "Bearer " + getToken() },
      baseURL:
        process.env.VUE_APP_BASE_API +
        "/khwarehouse/warehousebills/importCreate",
      //集装箱尺码字典表
      CntrsizeOptions: [],
      //模糊查询箱类型
      typeOptions: [],
      //附件上传弹窗
      dialogVisible: false,
      //调箱动作字典表
      boxActionOptions: [],
      //集装箱主字典表
      ownerOptions: [],
      //模糊下拉查询地点
      addressOptions: [],
      //空重字典表
      updateEFOptions: [],
      //状态字典表
      cntrstatusOptions: [],
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 客户详情表格数据
      corpsList: [],
      // 查询参数
      select: "",
      querDate: [],
      file: [],
      row: [],
      res: [],
      formList: {},
      approvalTwo: false,
      amountDr: null,
      amountCr: null,
      actId: null,
      // 打印弹窗
      dialogPrinting: false,
      boxSorting: {
        pageNum: 1,
        pageSize: 30,
        total: null,
      },
      // 上传loading
      uploadLoading: false,
    };
  },
  //页面跳转后传递参数
  activated() {
    this.jumpDonot = false;
    if (this.$route.query.testing) this.dataElist = true;
    this.modify = true;
    let formDate;
    if (this.$route.query.list) {
      formDate = {
        fId: JSON.parse(this.$route.query.list).billId,
      };
      this.actId = JSON.parse(this.$route.query.list).actId;
      this.formList = formDate;
      this.approVal = true;
      this.cancelButton = false;
    } else if (this.$route.query.data) {
      formDate = {
        fId: JSON.parse(this.$route.query.data).fId,
        num: JSON.parse(this.$route.query.data).num,
      };
      if (this.$route.query.data.fMblno) {
        formDate = {
          fMblno: JSON.parse(this.$route.query.data).fMblno,
          num: JSON.parse(this.$route.query.data).num,
        };
      }
      this.id = formDate.fId;
      this.formList = {
        fId: formDate.fId,
      };
      this.approVal = false;
    } else if (this.$route.query.testing) {
      console.log(this.$route.query.testing);
      formDate = {
        fId: JSON.parse(this.$route.query.testing).billId,
      };
      this.formList = formDate;
      this.approvalTwo = true;
      this.approVal = false;
      this.cancelButton = false;
    } else if (this.$route.query.DC) {
      formDate = {
        fMblno: JSON.parse(this.$route.query.DC).fMblno,
        num: JSON.parse(this.$route.query.DC).num,
      };
    }
    if (formDate) {
      addmodify(formDate).then((response) => {
        console.log(response);
        if (response.code == 200) {
          this.form = response.rows[0];
          console.log(this.form);
          if (this.form.fMblno == null) {
            this.changeNum = false;
          } else {
            this.changeNum = true;
          }
          let data = {
            actId: 460,
            id: this.form.fId,
          };
          getName(data).then((response) => {
            if (response.data.length != 0) {
              this.before = response.data[0].userName;
            }
          });
          queryUserVal().then((response) => {
            this.current = response.user.userName;
            if (formDate.num) {
              if (this.form.moneyStatus >= 4) {
                this.jumpDonot = true;
              }
              if (this.current == this.before) {
                this.disappear = false;
              }
            } else {
              this.jumpDonot = true;
              this.disappear = true;
            }
          });
          this.$set(this.form, "fPaymode", JSON.stringify(this.form.fPaymode));
          this.$set(this.form, "fSign", JSON.stringify(this.form.fSign));
          this.$set(
            this.form,
            "fDetentioncargo",
            JSON.stringify(this.form.fDetentioncargo)
          );
          this.goodsList = response.rows[0].tWarehousebillsCntrList;
          this.estimatedTime = response.rows[0].tVoyageL;
          if (response.rows[0].tWarehousebillsCntritemsList !== null) {
            this.dataList = response.rows[0].tWarehousebillsCntritemsList;
          } else this.dataList = [];
          this.loading = false;
          if (response.rows[0].tWarehousebillsfeesDr) {
            this.warehouseDrList = response.rows[0].tWarehousebillsfeesDr;
            for (let item in this.warehouseDrList) {
              this.$set(
                this.warehouseDrList[item],
                "fFeeUnitid",
                JSON.stringify(this.warehouseDrList[item].fFeeunitid)
              );
              // this.$set(this.warehouseDrList[item], 'fCorpid', JSON.stringify(this.warehouseDrList[item].fCorpid))
            }
          }
          if (response.rows[0].warehousebillsfeesCr) {
            this.warehouseCrList = response.rows[0].warehousebillsfeesCr;
            for (let item in this.warehouseCrList) {
              this.$set(
                this.warehouseCrList[item],
                "fFeeUnitid",
                JSON.stringify(this.warehouseCrList[item].fFeeunitid)
              );
            }
          }
        }
      });
    }
  },
  created() {
    nameOfVessel().then((res) => {
      this.vslidList = res.rows;
    });
    voyageNumber().then((res) => {
      this.voyidList = res.rows;
    });
    getfLaneName().then((res) => {
      this.fLaneList = res.rows;
    });
    portInquiry().then((res) => {
      this.fMblnoOptions = res.rows;
    });
    this.getDicts("data_unitfees").then((response) => {
      if (response.data) {
        this.jFeetunitOptions = response.data;
      }
    });
    this.getDicts("data_stltype_type").then((response) => {
      if (response.data) {
        this.fStltypeOptions = response.data;
      }
    });
    this.getDicts("tax_rate").then((response) => {
      if (response.data) {
        this.fTaxrate = response.data[0].dictValue;
      }
    });
    this.getDicts("f_packageid").then((response) => {
      if (response.data) {
        this.packgeOptions = response.data;
      }
    });
    this.getDicts("data_billType").then((response) => {
      if (response.data) {
        this.businessTypeOptions = response.data;
      }
    });
    this.getDicts("f_updateEF").then((response) => {
      if (response.data) {
        this.fStatus = response.data;
      }
    });
    this.getDicts("f_serviceitems").then((response) => {
      if (response.data) {
        this.transport = response.data;
      }
    });
         this.getDicts("f_serviceitemsNew").then((response) => {
        this.fServiceitemsNews = response.data;
      });
    this.getDicts("f_paymode").then((response) => {
      if (response.data) {
        this.paymentMethod = response.data;
      }
    });
    this.getDicts("f_invoceobj").then((response) => {
      if (response.data) {
        this.drawee = response.data;
      }
    });
    this.getDicts("f_sign").then((response) => {
      if (response.data) {
        this.cEsign = response.data;
      }
    });
    this.getDicts("f_detentioncargo").then((response) => {
      if (response.data) {
        this.etentioncargo = response.data;
      }
    });
    this.getDicts("f_insurance").then((response) => {
      if (response.data) {
        this.insurance = response.data;
      }
    });
    this.cntrtypeRemoteMethod();
    this.goodRemoteMethod();
    this.nameRemoteMethod();
    this.fWRemoteMethod();
    this.queryGoods();
    let queryParams = { pageNum: 1, fDc: "C" };
    listFees(queryParams).then((response) => {
      this.fCNameOptions = response.rows;
    });
    let query = { pageNum: 1, fDc: "D" };
    listFees(query).then((response) => {
      this.fDNameOptions = response.rows;
    });
  },
  filters: {
    fServiceitemsNameFormat(row, transport) {
      let name;
      transport.map((e) => {
        if (row == e.dictValue) {
          name = e.dictLabel;
        }
      });
      return name;
    },
    fVslidFormat(row, vslidList) {
      let name;
      vslidList.map((e) => {
        if (row == e.fId) {
          name = e.fName;
        }
      });
      return name;
    },
    voyidNameFormat(row, voyidList) {
      let name;
      voyidList.map((e) => {
        if (row == e.fId) {
          name = e.fNo;
        }
      });
      return name;
    },
    portFormat(row, fMblnoOptions) {
      let name;
      fMblnoOptions.map((e) => {
        if (row == e.fId) {
          name = e.fName;
        }
      });
      return name;
    },
    goodsFormat(row, goodsOptions) {
      let name;
      goodsOptions.map((e) => {
        if (row == e.fId) {
          name = e.fName;
        }
      });
      return name;
    },
    cntrFormat(row, cntrOptions) {
      let name;
      cntrOptions.map((e) => {
        if (row == e.fId) {
          name = e.fNo;
        }
      });
      return name;
    },
  },
  methods: {
    rejectDeletion() {
      this.$confirm("驳回并删除, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          reject(this.form.fId).then((res) => {
            if (res.code === 200) {
              this.$message({
                type: "success",
                message: "删除成功!",
              });
              this.cancelTwo();
            }
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消",
          });
        });
    },
    seleEt(scope) {
      console.log(scope);
      for (let item in this.cntrOptions) {
        if (this.cntrOptions[item].fId === scope.row.fCntrid) {
          if (this.cntrOptions[item].fType === 2) {
            this.whether = true;
            return;
          } else {
            this.whether = false;
            return;
          }
        }
      }
    },
    throttleOpening(res) {
      if (res <= 100) {
      } else {
        this.list.fDraught = "";
        this.$message({
          showClose: true,
          message: "不能大于100%或小于0%",
          type: "error",
          offset: 90,
        });
      }
    },
    temperature(res) {
      if (res < 20 && res > -30) {
      } else if (res == "-") {
      } else {
        this.list.fTemperature = "";
        this.$message({
          showClose: true,
          message: "冷藏箱温度为-30℃至20℃之间的整数",
          type: "error",
          offset: 90,
        });
      }
    },
    selectChange(scope) {
      for (let item in this.goods) {
        if (this.goods[item].fId === scope.row.fGoodsid) {
          scope.row.typeidName = this.goods[item].typeName;
        }
      }
    },
    queryGoods() {
      getGoodName().then((res) => {
        if (res.code == 200) {
          this.goods = res.data;
        }
      });
    },
    homePage() {
      this.open = false;
      let view = {
        fullPath: "/finance/contrast",
        hash: "",
        matched: Array(2),
        meta: Object,
        name: "Contrast",
        params: Object,
        path: "/finance/contrast",
        query: Object,
        title: "对账",
      };
      this.$router.push({ path: "/index" });
      this.$store
        .dispatch("tagsView/delView", view)
        .then(({ visitedViews }) => {
          if (this.isActive(view)) {
            this.toLastView(visitedViews, view);
          }
        });
      Global.$emit("removeCache", "closeSelectedTag", view);
    },
    cancel() {
      if (
        this.form.moneyStatus === 4 ||
        this.form.fBillstatus === 4 ||
        this.form.fBillstatus === 9 ||
        this.modify == true
      ) {
        if (this.$route.query.DC) {
          if (JSON.parse(this.$route.query.DC).type == "D") {
            this.$router.push({ path: "/analysis/generalLedgerDr" });
          } else {
            this.$router.push({ path: "/analysis/generalLedgerCr" });
          }
        } else {
          this.$router.push({ path: "/domesticTrade/myOrder" });
        }
      } else {
        this.$confirm("返回列表，是否保存?", "提示", {
          confirmButtonText: "保存",
          cancelButtonText: "取消",
          type: "warning",
        })
          .then(() => {
            this.approval();
          })
          .catch(() => {
            if (this.$route.query.DC) {
              if (JSON.parse(this.$route.query.DC).type == "D") {
                this.$router.push({ path: "/analysis/generalLedgerDr" });
              } else {
                this.$router.push({ path: "/analysis/generalLedgerCr" });
              }
            } else {
              this.$router.push({ path: "/domesticTrade/myOrder" });
            }
            this.modify = true;
          });
      }
    },
    //撤销审批
    revokeTwo(status) {
      let data = {
        actId: 460,
        billId: this.form.fId,
        id: this.form.fId,
        fidStatus: status,
      };
      revokeTwo(data).then((data) => {
        if (data.code === 200) {
          this.msgSuccess("撤销成功");
          this.jumpDonot = false;
          if (this.formList) {
            addmodify(this.formList).then((response) => {
              this.form = response.rows[0];
              let data = {
                actId: 460,
                id: this.form.fId,
              };
              getName(data).then((response) => {
                if (response.data.length != 0) {
                  this.before = response.data[0].userName;
                }
              });
              queryUserVal().then((response) => {
                this.current = response.user.userName;
              });
              this.goodsList = response.rows[0].tWarehousebillsCntrList;
              this.estimatedTime = response.rows[0].tVoyageL;
              if (response.rows[0].tWarehousebillsCntritemsList !== null) {
                this.dataList = response.rows[0].tWarehousebillsCntritemsList;
              } else this.dataList = [];
              this.loading = false;
              if (response.rows[0].tWarehousebillsfeesDr) {
                this.warehouseDrList = response.rows[0].tWarehousebillsfeesDr;
                for (let item in this.warehouseDrList) {
                  this.$set(
                    this.warehouseDrList[item],
                    "fFeeUnitid",
                    JSON.stringify(this.warehouseDrList[item].fFeeunitid)
                  );
                }
              }
              if (response.rows[0].warehousebillsfeesCr) {
                this.warehouseCrList = response.rows[0].warehousebillsfeesCr;
                for (let item in this.warehouseCrList) {
                  this.$set(
                    this.warehouseCrList[item],
                    "fFeeUnitid",
                    JSON.stringify(this.warehouseCrList[item].fFeeunitid)
                  );
                }
              }
              // if(this.current == this.before)
              //   this.disappear = false;
            });
          }
          this.reset();
        }
      });
    },
    //费用提交审核
    feeSubmission() {
      if (!this.warehouseDrList && !this.warehouseCrList) {
        this.$message.error("请维护费用");
        return false;
      }
      if (this.warehouseDrList) {
        for (let li in this.warehouseDrList) {
          if (!this.warehouseDrList[li].fBusinessType) {
            this.$message.error(
              "应收费用第" + (Number(li) + 1) + "行业务类型为空，请维护业务类型"
            );
            return false;
          } else if (!this.warehouseDrList[li].fCorpid) {
            this.$message.error(
              "应收费用第" + (Number(li) + 1) + "行客户名称为空，请维护客户名称"
            );
            return false;
          } else if (!this.warehouseDrList[li].fFeeid) {
            this.$message.error(
              "应收费用第" + (Number(li) + 1) + "行费用名称为空，请维护费用名称"
            );
            return false;
          } else if (!this.warehouseDrList[li].fQty) {
            this.$message.error(
              "应收费用第" + (Number(li) + 1) + "行数量为空，请维护数量"
            );
            return false;
          } else if (
            this.warehouseDrList[li].fUnitprice === "" ||
            this.warehouseDrList[li].fUnitprice == undefined
          ) {
            this.$message.error(
              "应收费用第" + (Number(li) + 1) + "行单价为空，请维护单价"
            );
            return false;
          }
        }
      }
      if (this.warehouseCrList) {
        // console.log(this.warehouseCrList[1].fCorpid);
        for (let li in this.warehouseCrList) {
          if (!this.warehouseCrList[li].fBusinessType) {
            this.$message.error(
              "应付费用第" + (Number(li) + 1) + "行业务类型为空，请维护业务类型"
            );
            return false;
          } else if (!this.warehouseCrList[li].fCorpid) {
            this.$message.error(
              "应付费用第" + (Number(li) + 1) + "行客户名称为空，请维护客户名称"
            );
            return false;
          } else if (!this.warehouseCrList[li].fFeeid) {
            this.$message.error(
              "应付费用第" + (Number(li) + 1) + "行费用名称为空，请维护费用名称"
            );
            return false;
          } else if (!this.warehouseCrList[li].fQty) {
            this.$message.error(
              "应付费用第" + (Number(li) + 1) + "行数量为空，请维护数量"
            );
            return false;
          } else if (
            this.warehouseCrList[li].fUnitprice === "" ||
            this.warehouseCrList[li].fUnitprice == undefined
          ) {
            this.$message.error(
              "应付费用第" + (Number(li) + 1) + "行单价为空，请维护单价"
            );
            return false;
          }
        }
      }

      let form = {
        fId: this.form.fId,
        fMblno: this.form.fMblno,
      };
      let formData = new window.FormData();
      for (let li in this.warehouseDrList) {
        this.warehouseDrList[li].fMblno = this.form.fMblno;
        for (let item in this.nameOptions) {
          if (
            this.warehouseDrList[li].fCorpid == this.nameOptions[item].fName
          ) {
            this.warehouseDrList[li].fCorpid = this.nameOptions[item].fId;
          }
        }
      }
      for (let li in this.warehouseCrList) {
        this.warehouseCrList[li].fMblno = this.form.fMblno;
      }
      formData.append("tWarehousebills", JSON.stringify(form));
      formData.append(
        "tWarehousebillsCntritems",
        JSON.stringify(this.dataList)
      );
      formData.append(
        "tWarehousebillsfeesDr",
        JSON.stringify(this.warehouseDrList)
      );
      formData.append(
        "tWarehousebillsfeesCr",
        JSON.stringify(this.warehouseCrList)
      );
      this.auditLoading=true
      getfee(formData).then((response) => {
        this.$message.success("操作成功");
        this.form.moneyStatus = 4;
        this.jumpDonot = true;
        this.modify = true;
        let data = {
          actId: 460,
          id: this.form.fId,
        };
        getName(data).then((response) => {
          if (response.data.length != 0) {
            this.before = response.data[0].userName;
            if (this.current == this.before) {
              this.disappear = false;
            }
          }
        });
      })
      .finally(() => {
         this.auditLoading= false;
      });
    },
    //箱信息操作限制
    cntrWeight(res) {
      if (res < 40 && res > 0) {
        return;
      } else if (res == "" || res == null) {
      } else {
        this.$message({
          showClose: true,
          message: "单箱重量应在0-40吨之间",
          type: "error",
          offset: 90,
        });
      }
    },
    //获取客户名称下拉
    nameRemoteMethod() {
      let queryParams = { pageNum: 1 };
      getFName(queryParams).then((response) => {
        this.nameOptions = response.data;
      });
    },
    //货名下拉
    goodRemoteMethod() {
      let queryParams = { pageNum: 1 };
      getGoodName(queryParams).then((response) => {
        this.goodsOptions = response.data;
      });
    },
    //箱型下拉获取
    cntrtypeRemoteMethod() {
      let queryParams = { pageNum: 1 };
      getCntr(queryParams).then((response) => {
        this.cntrOptions = response.rows;
      });
    },
    //计价单位
    // corpsRemoteMethod(name) {
    //   if (name == null || name === "") {
    //     return false;
    //   }
    //   let queryParams = { pageNum: 1, fName: name, type: 1 };
    //   listCorps(queryParams).then((response) => {
    //     this.fMblnoOptions = response.rows;
    //     this.KHblnoOptions = response.rows;
    //   });
    // },

    //应付信息新行
    addpayment() {
      this.warehouseCrList.push({
        fBusinessType: null,
        fCorpid: null,
        fFeeid: null,
        fFeeUnitid: "7",
        fQty: null,
        fUnitprice: null,
        fAmount: null,
        fStltypeid: null,
        fCurrency: "RMB",
        fExrate: "1",
        fTaxrate: this.fTaxrate,
        fSrcTypeId: 0,
        remark: null,
      });
    },
    // 数量计算
    changeContractAmt(row) {
      let fQty = 0;
      let fUnitprice = 0;
      if (row.fUnitprice) {
        fUnitprice = row.fUnitprice;
      }
      if (row.fQty) {
        fQty = row.fQty;
      }
      this.$set(
        row,
        "fAmount",
        parseFloat(Number(fUnitprice) * Number(fQty)).toFixed(2)
      );
    },

    // 变更计价单位
    changeFeeUnit(row) {
      if (!row.fFeeUnitid) {
        return false;
      }
      // if (row.fFeeUnitid === "2") {
      //   this.$set(row, "fQty", (this.fGrossweight / 1000).toFixed(2));
      // } else if (row.fFeeUnitid === "1") {
      //   this.$set(row, "fQty", this.fQty);
      // } else if (row.fFeeUnitid === "3") {
      //   this.$set(row, "fQty", (this.fNetweight / 1000).toFixed(2));
      // } else if (row.fFeeUnitid === "7") {
      //   this.$set(row, "fQty", this.fCntqty);
      // } else {
      //   this.$set(row, "fQty", 0);
      // }
      if (row.fUnitprice) {
        this.$set(
          row,
          "fAmount",
          parseFloat(Number(row.fUnitprice) * Number(row.fQty)).toFixed(2)
        );
      }
    },

    // 选择费用信息时获取计价单位
    // changeFeeId(row) {
    //   for (let li in this.fWbuOptions) {
    //     if (row.fFeeid === this.fWbuOptions[li].fId) {
    //       this.$set(row, "fFeeUnitid", this.fWbuOptions[li].fFeeunitid + "");
    //       this.changeFeeUnit(row);
    //       break;
    //     }
    //   }
    // },
    // 远程模糊查询费用名称
    fWRemoteMethod(name) {
      if (name == null || name === "") {
        return false;
      }
      let queryParams = { pageNum: 1, fDc: "C", fName: name };
      listFees(queryParams).then((response) => {
        this.fCNameOptions = response.rows;
      });
      let query = { pageNum: 1, fDc: "D", fName: name };
      listFees(query).then((response) => {
        this.fDNameOptions = response.rows;
      });
    },

    // 收款合计
    warehouseDrSummaries(param) {
      const { columns, data } = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = "合计";
          return;
        } else if (
          column.label == "单价" ||
          column.label == "数量" ||
          column.label == "金额"
        ) {
          const values = data.map((item) => Number(item[column.property]));
          if (!values.every((value) => isNaN(value))) {
            sums[index] = values.reduce((prev, curr) => {
              const value = Number(curr);
              if (!isNaN(value)) {
                return prev + curr;
              } else {
                return prev;
              }
            }, 0);
          }
        }
      });
      this.amountDr = sums[8];
      return sums;
    },
    //付款合计
    warehouseCrSummaries(param) {
      const { columns, data } = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = "合计";
          return;
        } else if (
          column.label == "单价" ||
          column.label == "数量" ||
          column.label == "金额"
        ) {
          const values = data.map((item) => Number(item[column.property]));
          if (!values.every((value) => isNaN(value))) {
            sums[index] = values.reduce((prev, curr) => {
              const value = Number(curr);
              if (!isNaN(value)) {
                return prev + curr;
              } else {
                return prev;
              }
            }, 0);
          }
        }
      });
      this.amountCr = sums[8];
      return sums;
    },
    addOrUpdateHand(form, status) {
      // if(form.fMblno == null){
      //   this.addOrUpdateVisib = false;
      //   this.$message.error("提单号为空，请维护提单号")
      //   return false
      // }else{
      //   this.addOrUpdateVisib = true;
      // }
      this.$refs["form"].validate((valid) => {
        if (valid) {
          this.addOrUpdateVisib = true;
          this.$nextTick(() => {
            // let actId = ''
            // if (this.form.fBillstatus < 6) {
            //   actId = '410'
            //   this.$refs.ApprovalComments.init(form.fId,status,actId,this.form.fMblno)
            // } else if(this.form.fBillstatus > 6 && this.form.fBillstatus <= 11 && this.form.moneyStatus < 4){
            //   actId = '420'
            //   this.$refs.ApprovalComments.init(form.fId, status,actId)
            // }else if (this.form.fBillstatus == 11 && this.form.moneyStatus >= 4 && this.form.moneyStatus < 6) {
            //   actId = '460'
            //   this.$refs.ApprovalComments.init(form.fId,status,actId)
            // }
            if (this.actId == "410") {
              this.$refs.ApprovalComments.init(
                form.fId,
                status,
                this.actId,
                this.form.fMblno
              );
            } else if (this.actId == "474") {
              this.$refs.ApprovalComments.init(
                form.fId,
                "f_dismount_status",
                this.actId
              );
            } else {
              this.$refs.ApprovalComments.init(form.fId, status, this.actId);
            }
          });
        } else {
          this.$message.error("提单号为空，请维护提单号");
        }
      });
    },
    modifyApproval() {
      this.addOrUpdateVisib = true;
      let list = JSON.parse(this.$route.query.testing);
      this.$nextTick(() => {
        let actId = "";
        console.log(list);
        this.addOrUpdateVisible = true;
        if (list.refno4 == "XGDD") {
          actId = 471;
        } else if (list.refno4 == "XGTJ") {
          actId = 472;
        } else if (list.refno4 == "DDSC") {
          actId = 473;
        }
        this.$refs.ApprovalComments.init(
          this.form.fId,
          status,
          actId,
          this.form.fMblno
        );
      });
    },
    //首页审批跳转关闭返回首页
    cancelTwo() {
      this.open = false;
      let view = {
        fullPath: "/domesticTrade/orderInformation?data=%7B%22fId%22%3A687%7D",
        hash: "",
        matched: Array(2),
        meta: Object,
        name: "OrderInformation",
        params: Object,
        path: "/domesticTrade/orderInformation",
        query: Object,
        title: "订单信息",
      };
      this.$router.push({ path: "/index" });
      this.$store
        .dispatch("tagsView/delView", view)
        .then(({ visitedViews }) => {
          if (this.isActive(view)) {
            this.toLastView(visitedViews, view);
          }
        });
      Global.$emit("removeCache", "closeSelectedTag", view);
    },

    // 查看审批流
    getDataList() {
      this.addOrUpdateVisible = false;
    },
    returnData() {
      this.addOrUpdateVisib = false;
      this.open = false;
      this.cancelTwo();
    },
    revisionApproval() {
      let list = JSON.parse(this.$route.query.testing);
      let actId = "";
      this.addOrUpdateVisible = true;
      if (list.refno4 == "XGDD") {
        actId = 471;
      } else if (list.refno4 == "XGTJ") {
        actId = 472;
      } else if (list.refno4 == "DDSC") {
        actId = 473;
      }
      this.$nextTick(() => {
        this.$refs.addOrUpdate.init(this.form.fId, actId, list.fidStatus);
      });
    },
    addOrUpdateHandle(status) {
      this.addOrUpdateVisible = true;
      let id = "448";
      let actId = "";
      if (!this.actId) {
        if (this.form.fBillstatus < 6) {
          actId = "410";
        } else if (this.form.moneyStatus != null && this.form.moneyStatus < 6) {
          actId = "460";
        } else {
          actId = "420";
        }
      } else {
        actId = this.actId;
      }
      if (this.actId == "474") status = "f_dismount_status";
      this.$nextTick(() => {
        this.$refs.addOrUpdate.init(this.form.fId, actId, status);
      });
    },
    handleSelect(type) {
      this.$refs.feeDialog.init(type);
    },
    importFee(list, type) {
      if (type == "收费") {
        console.log(list);
        list.forEach((e) => {
          this.warehouseDrList.push({
            fBusinessType:"3",
            fCorpid: this.form.corpName,
            fFeeid: e.fFeeId,
            fFeeUnitid: e.fFeeunitId + "",
            fQty:
              this.goodsList && this.goodsList.length > 0
                ? this.goodsList[0].fCntrcount
                : 0,
            fUnitprice: e.fPrice,
            fAmount:
              e.fPrice *
              (this.goodsList && this.goodsList.length > 0
                ? this.goodsList[0].fCntrcount
                : 0),
            fStltypeid:1,
            fCurrency: "RMB",
            fExrate: "1",
            fTaxrate: this.fTaxrate,
            fSrcTypeId: 0,
            remark: null,
          });
        });
      } else {
        list.forEach((e) => {
          this.warehouseCrList.push({
            fBusinessType:"3",
            fCorpid: null,
            fFeeid: e.fFeeId,
            fFeeUnitid: e.fFeeunitId + "",
            fQty:
              this.goodsList && this.goodsList.length > 0
                ? this.goodsList[0].fCntrcount
                : 0,
            fUnitprice: e.fPrice,
            fAmount:
              e.fPrice *
              (this.goodsList && this.goodsList.length > 0
                ? this.goodsList[0].fCntrcount
                : 0),
            fStltypeid:1,
            fCurrency: "RMB",
            fExrate: "1",
            fTaxrate: this.fTaxrate,
            fSrcTypeId: 0,
            remark: null,
          });
        });
      }
      console.log(list);
    },
    //应收新行
    addCollection() {
      this.warehouseDrList.push({
        fBusinessType: null,
        fCorpid: this.form.corpName,
        fFeeid: null,
        fFeeUnitid: "7",
        fQty: null,
        fUnitprice: null,
        fAmount: null,
        fStltypeid: null,
        fCurrency: "RMB",
        fExrate: "1",
        fTaxrate: this.fTaxrate,
        fSrcTypeId: 0,
        remark: null,
      });
    },
    //撤销审核
    revokeSubmission() {
      if (!this.warehouseDrList && !this.warehouseCrList) {
        this.$message.error("请维护费用");
        return false;
      }
      if (this.warehouseDrList) {
        for (let li in this.warehouseDrList) {
          if (!this.warehouseDrList[li].fBusinessType) {
            this.$message.error(
              "应收费用第" + (Number(li) + 1) + "行业务类型为空，请维护业务类型"
            );
            return false;
          } else if (!this.warehouseDrList[li].fCorpid) {
            this.$message.error(
              "应收费用第" + (Number(li) + 1) + "行客户名称为空，请维护客户名称"
            );
            return false;
          } else if (!this.warehouseDrList[li].fFeeid) {
            this.$message.error(
              "应收费用第" + (Number(li) + 1) + "行费用名称为空，请维护费用名称"
            );
            return false;
          } else if (!this.warehouseDrList[li].fQty) {
            this.$message.error(
              "应收费用第" + (Number(li) + 1) + "行数量为空，请维护数量"
            );
            return false;
          } else if (
            this.warehouseDrList[li].fUnitprice === "" ||
            this.warehouseDrList[li].fUnitprice == undefined
          ) {
            this.$message.error(
              "应收费用第" + (Number(li) + 1) + "行单价为空，请维护单价"
            );
            return false;
          }
        }
      }
      if (this.warehouseCrList) {
        // console.log(this.warehouseCrList[1].fCorpid);
        for (let li in this.warehouseCrList) {
          if (!this.warehouseCrList[li].fBusinessType) {
            this.$message.error(
              "应付费用第" + (Number(li) + 1) + "行业务类型为空，请维护业务类型"
            );
            return false;
          } else if (!this.warehouseCrList[li].fCorpid) {
            this.$message.error(
              "应付费用第" + (Number(li) + 1) + "行客户名称为空，请维护客户名称"
            );
            return false;
          } else if (!this.warehouseCrList[li].fFeeid) {
            this.$message.error(
              "应付费用第" + (Number(li) + 1) + "行费用名称为空，请维护费用名称"
            );
            return false;
          } else if (!this.warehouseCrList[li].fQty) {
            this.$message.error(
              "应付费用第" + (Number(li) + 1) + "行数量为空，请维护数量"
            );
            return false;
          } else if (
            this.warehouseCrList[li].fUnitprice === "" ||
            this.warehouseCrList[li].fUnitprice == undefined
          ) {
            this.$message.error(
              "应付费用第" + (Number(li) + 1) + "行单价为空，请维护单价"
            );
            return false;
          }
        }
      }

      let form = {
        fId: this.form.fId,
        fMblno: this.form.fMblno,
      };
      let formData = new window.FormData();
      for (let li in this.warehouseDrList) {
        this.warehouseDrList[li].fMblno = this.form.fMblno;
        for (let item in this.nameOptions) {
          if (
            this.warehouseDrList[li].fCorpid == this.nameOptions[item].fName
          ) {
            this.warehouseDrList[li].fCorpid = this.nameOptions[item].fId;
          }
        }
      }
      for (let li in this.warehouseCrList) {
        this.warehouseCrList[li].fMblno = this.form.fMblno;
      }
      formData.append("tWarehousebills", JSON.stringify(form));
      formData.append(
        "tWarehousebillsCntritems",
        JSON.stringify(this.dataList)
      );
      formData.append(
        "tWarehousebillsfeesDr",
        JSON.stringify(this.warehouseDrList)
      );
      formData.append(
        "tWarehousebillsfeesCr",
        JSON.stringify(this.warehouseCrList)
      );
      this.auditLoading=true
      cancellationFees(formData).then((response) => {
        this.$message.success("操作成功");
        this.form.moneyStatus = 4;
        this.jumpDonot = false;
        this.modify = true;
        let data = {
          actId: 460,
          id: this.form.fId,
        };
        getName(data).then((response) => {
          if (response.data.length != 0) {
            this.before = response.data[0].userName;
            if (this.current == this.before) {
              this.disappear = false;
            }
          }
        });
        if (response.data.tWarehouseBills) {
          this.form = response.data.tWarehouseBills;
          this.$set(this.form, "fPaymode", JSON.stringify(this.form.fPaymode));
          this.$set(this.form, "fSign", JSON.stringify(this.form.fSign));
          this.$set(
            this.form,
            "fDetentioncargo",
            JSON.stringify(this.form.fDetentioncargo)
          );
        }
        if (response.data.tWarehousebillsCntrList) {
          this.goodsList = response.data.tWarehousebillsCntrList;
        }
        if (response.data.tWarehousebillsCntritemsList !== null) {
          this.dataList = response.data.tWarehousebillsCntritemsList;
        } else this.dataList = [];
        if (response.data.warehousebillsfeesCrList) {
          this.warehouseCrList = response.data.warehousebillsfeesCrList;
          for (let item in this.warehouseCrList) {
            this.$set(
              this.warehouseCrList[item],
              "fFeeUnitid",
              JSON.stringify(this.warehouseCrList[item].fFeeunitid)
            );
          }
        }
        if (response.data.warehousebillsfeesDrList) {
          this.warehouseDrList = response.data.warehousebillsfeesDrList;
          for (let item in this.warehouseDrList) {
            this.$set(
              this.warehouseDrList[item],
              "fFeeUnitid",
              JSON.stringify(this.warehouseDrList[item].fFeeunitid)
            );
          }
        }
      })
      .finally(() => {
         this.auditLoading= false;
      });
    },
    //提交审批
    approval(res) {
      if (!this.form.fMblno) {
        this.$message.error("请维护提单号");
        return false;
      }
      // if (this.dataList.length === 0) {
      //   this.$message.error('请维护箱信息')
      //   return false
      // }
      if (
        (res != 1 && this.form.fMblno) ||
        (res != 1 && this.dataList.length != 0)
      ) {
        this.$router.push({ path: "/domesticTrade/myOrder" });
        this.modify = true;
      }
      let form = {
        fId: this.form.fId,
        fMblno: this.form.fMblno,
      };
      let formData = new window.FormData();
      for (let li in this.warehouseDrList) {
        this.warehouseDrList[li].fMblno = this.form.fMblno;
        for (let item in this.nameOptions) {
          if (
            this.warehouseDrList[li].fCorpid == this.nameOptions[item].fName
          ) {
            this.warehouseDrList[li].fCorpid = this.nameOptions[item].fId;
          }
        }
      }
      for (let item in this.warehouseCrList) {
        this.warehouseCrList[item].fMblno = this.form.fMblno;
      }
      formData.append("tWarehousebills", JSON.stringify(this.form));
      formData.append("tWarehousebillsCntr", JSON.stringify(this.goodsList));
      formData.append(
        "tWarehousebillsCntritems",
        JSON.stringify(this.dataList)
      );
      formData.append(
        "tWarehousebillsfeesDr",
        JSON.stringify(this.warehouseDrList)
      );
      formData.append(
        "tWarehousebillsfeesCr",
        JSON.stringify(this.warehouseCrList)
      );
      postApproval(formData).then((response) => {
        this.msgSuccess("操作成功");
        if (response.data.tWarehouseBills) {
          this.form = response.data.tWarehouseBills;
          this.$set(this.form, "fPaymode", JSON.stringify(this.form.fPaymode));
          this.$set(this.form, "fSign", JSON.stringify(this.form.fSign));
          this.$set(
            this.form,
            "fDetentioncargo",
            JSON.stringify(this.form.fDetentioncargo)
          );
        }
        if (response.data.tWarehousebillsCntrList) {
          this.goodsList = response.data.tWarehousebillsCntrList;
        }
        if (response.data.tWarehousebillsCntritemsList !== null) {
          this.dataList = response.data.tWarehousebillsCntritemsList;
        } else this.dataList = [];
        if (response.data.warehousebillsfeesCrList) {
          this.warehouseCrList = response.data.warehousebillsfeesCrList;
          for (let item in this.warehouseCrList) {
            this.$set(
              this.warehouseCrList[item],
              "fFeeUnitid",
              JSON.stringify(this.warehouseCrList[item].fFeeunitid)
            );
          }
        }
        if (response.data.warehousebillsfeesDrList) {
          this.warehouseDrList = response.data.warehousebillsfeesDrList;
          for (let item in this.warehouseDrList) {
            this.$set(
              this.warehouseDrList[item],
              "fFeeUnitid",
              JSON.stringify(this.warehouseDrList[item].fFeeunitid)
            );
          }
        }
      });
    },
    //新行
    addList() {
      this.dataList.push({
        fManual: "1",
        fCntrno: null,
        fSealno: null,
        fCntrweight: null,
        fGoodsid: null,
        fPackageid: null,
        fCntrid: null,
      });
    },
    //查看附件
    check(status) {
      this.dialogVisible = true;
      if (status === 1) {
      } else {
      }
    },
    saveFile() {
      this.row.accessoryList = this.file;
      this.dialogVisible = false;
      this.relevantAttachments = [];
    },
    deleteRow(index, rows) {
      rows.splice(index, 1);
    },
    //多选框选中
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.fId);
      this.select = selection;
    },
    dialogPrint() {
      // for (let item in this.transport) {
      //   if (this.transport[item].dictValue == this.form.fServiceitems) {
      //     this.$set(this.form, 'fServiceitemsName', this.transport[item].dictLabel);
      //   }
      // }
      // this.fMblnoOptions.forEach(item => {
      //   if (item.fId == this.form.fLoadportid) {
      //     this.$set(this.form, 'fLoadportidName', item.fName);
      //   }
      //   if (item.fId == this.form.fDestportid) {
      //     this.$set(this.form, 'fDestportidName', item.fName);
      //   }
      // });
      // this.tableData.forEach(term => {
      //   this.goods.forEach(item => {
      //     if (item.fId == term.fGoodsid) {
      //       term.fGoodsid = item.fName;
      //     }
      //   });
      //   this.container.forEach(item => {
      //     if (item.fId == term.fCntrid) {
      //       term.fCntrid = item.fNo;
      //     }
      //   });
      // });
      this.dialogPrinting = true;
    },
    //确认打印
    Printing() {
      this.$printE(this.$refs.print);
    },
    Selectinventory(selection) {
      this.selection = selection;
    },
    deleteAll() {
      for (let item in this.selection) {
        if (!this.selection[item].fId)
          return this.$message.error("存在未保存的数据,请先保存再批量删除!");
      }
      let list = [];
      this.selection.forEach((item) => list.push(item.fId));
      list = JSON.stringify(list).replace(/\[|]/g, "");
      this.$confirm(
        "此操作将永久删除已选" + this.selection.length + "条箱信息, 是否继续?",
        "提示",
        {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }
      )
        .then(() => {
          deleteAll(list).then((res) => {
            shippingList({ fPid: this.form.fId }).then((res) => {
              this.dataList = res.rows;
            });
          });
          this.$message({
            type: "success",
            message: "删除成功!",
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
    },
    //文件上传时
    uploading(event, file, fileList) {
      this.uploadLoading = true;
      this.openFullScreen(false, "文件正在解析中");
    },
    //遮罩层
    openFullScreen(res, text) {
      const loading = this.$loading({
        lock: true,
        text: text,
        spinner: "el-icon-loading",
        background: "rgba(0, 0, 0, 0.7)",
      });
      if (res === true) loading.close();
      // setTimeout(() => {
      //   loading.close();
      // }, 1000);
    },
    //导入模板
    importTemplate(res, file) {
      console.log(res.data);
      if (res.data == 500) {
        this.$message.error(res.msg);
        return (this.loading = false);
      } else if (res.code == 200) {
        if (res.msg === "error") {
          console.log(res.data.List);
          if (res.data.tCnTrNoList && res.data.List) {
            this.$message({
              showClose: true,
              dangerouslyUseHTMLString: true,
              type: "error",
              duration: 10000,
              message:
                '<h3>导入数据有误</h3><h4 style="width: 80%;">' +
                res.data.tCnTrNoList +
                '</h4><h4 style="width: 80%;">' +
                res.data.List +
                "</h4>",
            });
          } else if (res.data.tCnTrNoList && !res.data.List) {
            this.$message({
              showClose: true,
              dangerouslyUseHTMLString: true,
              type: "error",
              duration: 10000,
              message:
                '<h3>导入数据有误</h3><h4 style="width: 80%;">' +
                res.data.tCnTrNoList +
                "</h4>",
            });
          } else {
            this.$message({
              showClose: true,
              dangerouslyUseHTMLString: true,
              type: "error",
              duration: 10000,
              message:
                '<h3>导入数据有误</h3><h4 style="width: 80%;">' +
                res.data.List +
                "</h4>",
            });
          }
          this.uploadLoading = false;
          return this.openFullScreen(true);
        }

        this.boxSorting = {
          pageNum: 1,
          total: null,
        };
        request({
          url: "/system/config/configKey/data_excel_pagenum",
          method: "get",
        }).then((resErr) => {
          console.log(resErr);
          if (resErr.msg) {
            this.boxSorting.pageSize = resErr.msg;
          } else {
            this.boxSorting.pageSize = 10;
          }
          request({
            url: "/warehouse/file/list",
            method: "get",
            params: {
              fileName: res.data.fileName,
              pageNum: this.boxSorting.pageNum,
              pageSize: this.boxSorting.pageSize,
            },
          }).then((response) => {
            console.log(response);
            let i = this.dataList.length;
            this.boxSorting.total = response.total;
            let data = response.rows;
            data.forEach((item) => {
              item.fCntrid = this.goodsList[0].fCntrid;
              item.fGoodsid = this.goodsList[0].fGoodsid;
              item.fPackageid = this.goodsList[0].fPackageid;
            });
            this.dataList = this.dataList.concat(data);
            if (this.boxSorting.total > 1) {
              this.boxSorting.pageNum++;
              this.boxInformatiNO(res, i);
            } else {
              console.log(res);
              request({
                url: "/warehouse/file/delete/" + res.data.fileName,
                method: "delete",
              });
              this.loading = false;
              this.openFullScreen(true);
            }
          });
        });
      } else {
        this.$message.error(res.msg);
      }
    },
    storageBox(res, i) {
      this.boxInformatiNO(res, i);
    },
    boxInformatiNO(res, i) {
      if (Number(this.dataList.length) - i < this.boxSorting.total) {
        request({
          url: "/warehouse/file/list",
          method: "get",
          params: {
            fileName: res.data.fileName,
            pageNum: this.boxSorting.pageNum,
            pageSize: this.boxSorting.pageSize,
          },
        }).then((response) => {
          // this.tableData = this.tableData.concat(response.data.rows);
          // console.log(this.tableData);
          this.boxSorting.pageNum++;

          let data = response.rows;
          data.forEach((item) => {
            item.fCntrid = this.goodsList[0].fCntrid;
            item.fGoodsid = this.goodsList[0].fGoodsid;
            item.fPackageid = this.goodsList[0].fPackageid;
          });
          this.dataList = this.dataList.concat(data);

          // console.log(this.tableData.length+1,i);
          // if (Number(Number(this.tableData.length+1)-i) === this.boxSorting.total){
          //   this.loading = false
          //   this.openFullScreen(true)
          //   request({
          //     url: '/warehouse/file/delete/'+res.fileName,
          //     method: 'delete',
          //   })
          // }
          // console.log(this.boxSorting.total);
          this.storageBox(res, i);
          // this.tableData = this.tableData.concat(response.data.data);
          // let obj = {};
          // this.tableData = this.tableData.reduce((current, next) => {
          //   obj[next.fCntrno] ? '' : obj[next.fCntrno] = true && current.push(next);
          //   return current;
          // }, []);
        });
      } else {
        let obj = {};
        this.dataList = this.dataList.reduce((current, next) => {
          obj[next.fCntrno]
            ? ""
            : (obj[next.fCntrno] = true && current.push(next));
          return current;
        }, []);
        request({
          url: "/warehouse/file/delete/" + res.data.fileName,
          method: "delete",
        });
        this.uploading = false;
        this.openFullScreen(true);
      }
    },
    // 费用变更
    feeChange(fDC) {
      let data = {
        form: {},
        warehousebillsfeesCr: [],
        warehousebillsfeesDr: [],
        billType: 'outStock',
        fDc: fDC
      }
      data.form = this.form
      data.form.fId = this.formList.fId;
      if (fDC == 'C') {
        data.warehousebillsfeesCr = this.warehouseCrList
      } else {
        data.warehousebillsfeesDr = this.warehouseDrList
      }
      this.$router.push({
        path: "/domesticTrade/costModify",
        query: { data: data},
      });
    },
  },
};
</script>
<style lang="scss" scoped>
.tabSetting {
  display: flex;
  justify-content: flex-end;
}

.listStyle {
  display: flex;
  border-top: 1px solid #dcdfe6;
  border-left: 1px solid #dcdfe6;
  border-right: 1px solid #dcdfe6;
}

.listStyle:last-child {
  border-bottom: 1px solid #dcdfe6;
}

.progress {
  display: flex;
  align-items: center;
  padding: 2px;
  background-color: rgba(0, 0, 0, 0.05);
  height: 100%;
}

.el-form {
  padding-top: 20px;
  //border-top:1px dashed #ccc;
}

.selectForm >>> .el-form-item__label {
  font-size: 12px !important;
}
.app-container /deep/ .el-collapse-item__content {
  padding-bottom: 0;
}
</style>
<style lang="scss">
.el-collapse-item__header {
  font-size: 16px;
  font-weight: bolder;
  padding-left: 5px;
  background-color: #f8f8f9;
}

.el-form-item__label {
  font-size: 12px;
}
</style>