<template>
  <div class="app-container">
    <div v-show="jiGang == false">
      <el-form
        :model="query"
        ref="queryForm"
        v-show="showSearch"
        :inline="true"
        label-width="88px"
      >
        <el-row>
          <el-form-item label="参考编号" prop="fMblno">
            <el-input
              v-model="query.fMblno"
              placeholder="请输入参考编号"
              clearable
              size="small"
            />
          </el-form-item>
          <el-form-item label="客户名称" prop="fCorpid">
            <el-select
                v-model="query.fCorpid"
                filterable
                remote
                placeholder="客户名称"
            >
              <el-option
                  v-for="(dict, index) in KHblnoOptions"
                  :key="index.fId"
                  :label="dict.fName"
                  :value="dict.fId"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-button
              type="cyan"
              icon="el-icon-search"
              size="mini"
              @click="getList"
            >搜索
            </el-button>
            <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置
            </el-button>
          </el-form-item>
        </el-row>
      </el-form>
      <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
          <el-button
            type="primary"
            icon="el-icon-plus"
            size="mini"
            @click="handleAdd()"
            v-hasPermi="['warehouseBusiness:containerPort:add']"
          >新增
          </el-button>
        </el-col>
        <el-col :span="1.5">
          <el-button
            type="success"
            icon="el-icon-edit"
            size="mini"
            :disabled="single"
            @click="handleUpdate"
            v-hasPermi="['agreement:agreementTask:edit']"
          >修改
          </el-button>
        </el-col>
        <!--      <el-col :span="1.5">-->
        <!--        <el-button-->
        <!--          type="danger"-->
        <!--          icon="el-icon-delete"-->
        <!--          size="mini"-->
        <!--          :disabled="multiple"-->
        <!--          @click="handleDelete"-->
        <!--          v-hasPermi="['agreement:agreementTask:remove']"-->
        <!--        >删除-->
        <!--        </el-button>-->
        <!--      </el-col>-->
        <!--    <el-col :span="1.5">-->
        <!--      <el-button-->
        <!--        type="info"-->
        <!--        icon="el-icon-download"-->
        <!--        size="mini"-->
        <!--        :disabled="single"-->
        <!--        @click="handleUpdate(null, 2)"-->
        <!--        v-hasPermi="['agreement:agreementStorage:export']"-->
        <!--      >复制新增-->
        <!--      </el-button>-->
        <!--    </el-col>-->
        <right-toolbar
          :showSearch.sync="showSearch"
          @queryTable="getList"
        ></right-toolbar>
      </el-row>
      <el-table
        v-loading="loading"
        :data="agreementList"
        @selection-change="handleSelectionChange"
      >
        <el-table-column type="selection" width="55" align="center"/>
        <el-table-column type="index" label="行号" align="center" fixed width="60"/>
        <el-table-column
            label="参考编号"
            sortable
            align="center"
            prop="fMblno"
            fixed
            show-overflow-tooltip
        />
        <el-table-column
            label="单据类型"
            sortable
            align="center"
            prop="fBilltype"
            fixed
            show-overflow-tooltip
        />
        <el-table-column
            label="单据编号"
            sortable
            align="center"
            prop="fBillno"
            fixed
            show-overflow-tooltip
        />
        <el-table-column
          label="单据日期"
          sortable
          align="center"
          prop="fBsdate"
          fixed
          show-overflow-tooltip
        />
        <el-table-column
          label="制单人"
          sortable
          align="center"
          prop="createBy"
          fixed
          show-overflow-tooltip
        />
        <el-table-column
          label="备注"
          sortable
          align="center"
          prop="remark"
          fixed
          show-overflow-tooltip
        />
        <el-table-column
          label="操作"
          align="center"
          fixed="right"
          width="180"
          class-name="small-padding fixed-width"
        >
          <template slot-scope="scope">
            <el-button
              size="mini"
              type="text"
              icon="el-icon-view"
              @click="handleUpdate(scope.row)"
            >查看
            </el-button>
            <el-button
              size="mini"
              type="text"
              icon="el-icon-edit"
              @click="handleUpdate(scope.row)"
              v-if="scope.row.fBillstatus === '暂存'"
              v-hasPermi="['warehouseBusiness:containerPort:edit']"
            >修改
            </el-button>
            <el-button
              size="mini"
              type="text"
              icon="el-icon-delete"
              @click="handleDelete(scope.row)"
              v-if="scope.row.fBillstatus === '暂存'"
              v-hasPermi="['warehouseBusiness:containerPort:remove']"
            >删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <div style="padding-top: 10px;float: right;padding-bottom: 20px">
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :page-sizes="[10, 20, 30, 40]"
          background
          layout="sizes, prev, pager, next"
          :total="total">
        </el-pagination>
      </div>
    </div>
    <div v-show="jiGang == true">
      <div style="margin-bottom: 20px;">
        <el-button round icon="el-icon-arrow-left" @click="open" size="small">返回列表</el-button>
        <el-button type="primary" round size="small" @click="submitForm" icon="el-icon-edit">保 存</el-button>
        <el-button type="success" round size="small" @click="submit" icon="el-icon-check" :disabled="disabled">提 交</el-button>
        <el-button type="danger" round size="small" icon="el-icon-close" @click="cancellation"
                   v-if="queryParams.fBillstatus >2">撤销提交
        </el-button>
      </div>
      <el-form
        :model="queryParams"
        ref="rules"
        :rules="rules"
        :inline="true"
        label-width="88px"
      >
        <el-row>
          <el-form-item label="日期" prop="fBsdate">
            <el-date-picker
              v-model="queryParams.fBsdate"
              type="date"
              style="width: 200px;"
              value-format="yyyy-MM-dd"
              :disabled="disabled"
              clearable
              size="small"
              placeholder="选择日期"
            >
            </el-date-picker>
          </el-form-item>
          <el-form-item label="参考编号" prop="fMblno">
            <el-input
              v-model="queryParams.fMblno"
              placeholder="请输入参考编号"
              style="width: 200px;"
              :disabled="disabled"
              clearable
              size="small"
            />
          </el-form-item>
          <el-form-item label="单据编号" prop="fBillno">
            <el-input
              v-model="queryParams.fBillno"
              placeholder="请输入单据编号"
              style="width: 200px;"
              disabled
              clearable
              size="small"
            />
          </el-form-item>
          <el-form-item label="船名">
            <template slot-scope="scope">
              <el-select
                  v-model="queryParams.fVslid"
                  style="width: 200px;"
                  size="small"
                  placeholder="请选择船名"
                  filterable
              >
                <el-option
                    v-for="item in TVesselfs"
                    :key="item.fId"
                    :label="item.fName"
                    :value="item.fId"
                />
              </el-select>
            </template>
          </el-form-item>
          <el-form-item
              prop="fVoyid"
              header-align="center"
              label="航次"
          >
            <template slot-scope="scope">
              <el-select
                  v-model="queryParams.fVoyid"
                  size="small"
                  style="width: 200px;"
                  placeholder="请选择航次"
                  filterable
              >
                <el-option
                    v-for="item in TVoyagefs"
                    :key="item.fId"
                    :label="item.fNo"
                    :value="item.fId"
                />
              </el-select>
            </template>
          </el-form-item>
          <el-form-item label="备注" prop="remark">
            <el-input
                v-model="queryParams.remark"
                placeholder="请输入备注"
                :disabled="disabled"
                style="width: 796px;"
                clearable
                size="small"
            />
          </el-form-item>
        </el-row>
      </el-form>

      <h3><i class="el-icon-circle-plus"></i>收款信息</h3>
      <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"
            @click.prevent="addCollection()"
            :disabled="disabled"
          >新行
          </el-button>
          <!-- <el-button :disabled="browseStatus" @click.prevent="deleteRow(warehouseDrList)"
          >删除
        </el-button> -->
        </div>
      </div>
      <el-table
        :data="warehouseDrList"
        ref="table"
        tooltip-effect="dark"
        border
        stripe
        show-summary
        :disabled="disabled"
        :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="fCorpid"
          header-align="center"
          align="center"
          width="180px"
          label="客户名称"
        >
          <template slot-scope="scope">
            <el-select
              v-model="scope.row.fCorpid"
              filterable
              remote
              placeholder="客户名称"
              :disabled="disabled"
            >
              <el-option
                v-for="(dict, index) in KHblnoOptions"
                :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-->
<!--              style="width: 80%"-->
<!--              v-model="scope.row.fFeeunitid"-->
<!--              filterable-->
<!--              :disabled="disabled"-->
<!--            >-->
<!--              <el-option-->
<!--                v-for="(dict, index) in businessTypeOption"-->
<!--                :key="index.dictValue"-->
<!--                :label="dict.dictLabel"-->
<!--                :value="dict.dictValue"-->
<!--              ></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
              style="width: 80%"
              v-model="scope.row.fFeeid"
              filterable
              :disabled="disabled"
            >
              <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="请选择计费单位"
                :disabled="disabled"
                clearable
            >
              <el-option
                  v-for="dict in fFeetUnitOptions"
                  :key="dict.dictValue"
                  :label="dict.dictLabel"
                  :value="dict.dictValue"
              />
            </el-select>
          </template>
        </el-table-column>
<!--        <el-table-column-->
<!--          prop="fInventoryDays"-->
<!--          header-align="center"-->
<!--          align="center"-->
<!--          width="180px"-->
<!--          label="箱型"-->
<!--        >-->
<!--          <template slot-scope="scope">-->
<!--            <el-select-->
<!--              v-model="scope.row.fInventoryDays"-->
<!--              placeholder="请选择箱型"-->
<!--              clearable-->
<!--              :disabled="disabled"-->
<!--            >-->
<!--              <el-option-->
<!--                v-for="(dict, index) in jFeetunitOptions"-->
<!--                :key="index.fId"-->
<!--                :label="dict.fNo"-->
<!--                :value="dict.fId"-->
<!--              />-->
<!--            </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="数量"
              @input="calculation(scope.row)"
              show-word-limit
              :disabled="disabled"
            />
          </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="单价"
              show-word-limit
              @input="calculation(scope.row)"
              :disabled="disabled"
            />
          </template>
        </el-table-column>
        <el-table-column
          prop="fAmt"
          header-align="center"
          align="center"
          width="130px"
          label="金额"
        >
          <template slot-scope="scope">
            <el-input
              :disabled="disabled"
              oninput='this.value=this.value.replace(/[^\-?\d.]/g,"").replace(/^(\-)*(\d+)\.(\d\d).*$/, "$1$2.$3")'
              v-model="scope.row.fAmt"
              placeholder="金额"
              show-word-limit
            />
          </template>
        </el-table-column>
        <el-table-column
            prop="fCurrency"
            header-align="center"
            align="center"
            width="130px"
            label="币别"
        >
          <template slot-scope="scope">
            <el-select
                v-model="scope.row.fCurrency"
                placeholder="请选择币别"
                :disabled="disabled"
                clearable
            >
              <el-option
                  v-for="dict in currencyList"
                  :key="dict.dictValue"
                  :label="dict.dictLabel"
                  :value="dict.dictValue"
              />
            </el-select>
          </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="disabled"
                placeholder="汇率"
                show-word-limit
            />
          </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="browseStatus || scope.row.fBillstatus == 6"
                placeholder="备注"
                show-word-limit
            />
          </template>
        </el-table-column>
        <el-table-column
          header-align="center"
          align="center"
          label="操作"
        >
          <template slot-scope="scope">
            <el-button
              @click.native.prevent="
                    deleteRow(scope.$index, warehouseDrList)
                  "
              size="small"
              :disabled="disabled"
            >移除
            </el-button
            >
          </template>
        </el-table-column>
      </el-table>
      <h3><i class="el-icon-remove"></i>付款信息</h3>
      <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"
            @click.prevent="addpayment()"
            size="small"
            :disabled="disabled"
          >新行
          </el-button>
        </div>
      </div>
      <el-table
        :data="warehouseCrList"
        :disabled="disabled"
        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="fCorpid"
            header-align="center"
            align="center"
            width="180px"
            label="客户名称"
        >
          <template slot-scope="scope">
            <el-select
                v-model="scope.row.fCorpid"
                filterable
                remote
                placeholder="客户名称"
                :disabled="disabled"
            >
              <el-option
                  v-for="(dict, index) in KHblnoOptions"
                  :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-->
        <!--              style="width: 80%"-->
        <!--              v-model="scope.row.fFeeunitid"-->
        <!--              filterable-->
        <!--              :disabled="disabled"-->
        <!--            >-->
        <!--              <el-option-->
        <!--                v-for="(dict, index) in businessTypeOption"-->
        <!--                :key="index.dictValue"-->
        <!--                :label="dict.dictLabel"-->
        <!--                :value="dict.dictValue"-->
        <!--              ></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
                style="width: 80%"
                v-model="scope.row.fFeeid"
                filterable
                :disabled="disabled"
            >
              <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"
                placeholder="请选择计费单位"
                :disabled="disabled"
                clearable
            >
              <el-option
                  v-for="dict in fFeetUnitOptions"
                  :key="dict.dictValue"
                  :label="dict.dictLabel"
                  :value="dict.dictValue"
              />
            </el-select>
          </template>
        </el-table-column>
        <!--        <el-table-column-->
        <!--          prop="fInventoryDays"-->
        <!--          header-align="center"-->
        <!--          align="center"-->
        <!--          width="180px"-->
        <!--          label="箱型"-->
        <!--        >-->
        <!--          <template slot-scope="scope">-->
        <!--            <el-select-->
        <!--              v-model="scope.row.fInventoryDays"-->
        <!--              placeholder="请选择箱型"-->
        <!--              clearable-->
        <!--              :disabled="disabled"-->
        <!--            >-->
        <!--              <el-option-->
        <!--                v-for="(dict, index) in jFeetunitOptions"-->
        <!--                :key="index.fId"-->
        <!--                :label="dict.fNo"-->
        <!--                :value="dict.fId"-->
        <!--              />-->
        <!--            </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="数量"
                      @input="calculation(scope.row)"
                      show-word-limit
                      :disabled="disabled"
                    />
                  </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="单价"
                show-word-limit
                @input="calculation(scope.row)"
                :disabled="disabled"
            />
          </template>
        </el-table-column>
        <el-table-column
            prop="fAmt"
            header-align="center"
            align="center"
            width="130px"
            label="金额"
        >
          <template slot-scope="scope">
            <el-input
                :disabled="disabled"
                oninput='this.value=this.value.replace(/[^\-?\d.]/g,"").replace(/^(\-)*(\d+)\.(\d\d).*$/, "$1$2.$3")'
                v-model="scope.row.fAmt"
                placeholder="金额"
                show-word-limit
            />
          </template>
        </el-table-column>
        <el-table-column
            prop="fCurrency"
            header-align="center"
            align="center"
            width="130px"
            label="币别"
        >
          <template slot-scope="scope">
            <el-select
                v-model="scope.row.fCurrency"
                placeholder="请选择币别"
                :disabled="disabled"
                clearable
            >
              <el-option
                  v-for="dict in currencyList"
                  :key="dict.dictValue"
                  :label="dict.dictLabel"
                  :value="dict.dictValue"
              />
            </el-select>
          </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="disabled"
                placeholder="汇率"
                show-word-limit
            />
          </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="browseStatus || scope.row.fBillstatus == 6"
                placeholder="备注"
                show-word-limit
            />
          </template>
        </el-table-column>
        <el-table-column
          header-align="center"
          align="center"
          label="操作"
        >
          <template slot-scope="scope">
            <!-- <el-button size="small">审核费用</el-button> -->
            <el-button
              @click.native.prevent="
                    deleteRow(scope.$index, warehouseCrList)
                  "
              size="small"
              :disabled="disabled"
            >移除
            </el-button
            >
          </template>
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
import {
  listCorps,
  preservation,
  submit,
  allInformation,
  single,
  singleDeletion,
  listCorps_s,
  revokeContainerPort
} from '@/api/otherFinancial'
import {listFees} from '@/api/basicdata/fees'
import {selectTVesself, selectTVoyagef} from "@/api/finance/kaihe/payment";

export default {
  name: 'jiGang',
  data() {
    return {
      rules:{
        fBsdate:[{required: true, message: ' ', trigger: 'blur'}],
        fMblno:[{required: true, message: ' ', trigger: 'blur'}]
      },
      showSearch: true,
      jiGang: false,
      disabled: false,
      agreementList: [],
      warehouseCrList: [],
      fCNameOptions: [],
      fFeeid_s: [],
      fStltypeOptions: [],
      jFeetunitOptions: [],
      KHblnoOptions: [],
      browseStatus: false,
      fDNameOptions: [],
      warehouseDrList: [],
      businessTypeOption: [],
      loading: true,
      blnoOptions: [],
      single: true,
      total: 0,
      query: {
        pageNum: 1,
        pageSize: 10
      },
      selection: [],
      queryParams: {},
      fFeetUnitOptions:[],
      currencyList:[],
      TVesselfs:[],
      TVoyagefs:[]
    }
  },
  created() {
    selectTVesself().then((res) => {
      this.TVesselfs = res.rows;
    });
    selectTVoyagef().then((res) => {
      this.TVoyagefs = res.rows;
    });
    this.getDicts("currency_difference").then((response) => {
      this.currencyList = response.data;
    });
    this.corpsRemoteMethod()
    //付费
    listFees({fDc: "C"}).then((response) => {
      this.fCNameOptions = response.rows;
    });
    //收费
    listFees({fDc: "D"}).then((response) => {
      this.fDNameOptions = response.rows;
    });
    this.getDicts("data_unitfees").then((response) => {
      this.fFeetUnitOptions = response.data;
    });
    allInformation().then(res => {
      if (res.data.corpList) {
        this.KHblnoOptions = res.data.corpList
      }
      if (res.data.pierList) {
        this.businessTypeOption = res.data.pierList
      }
      if (res.data.cntrList) {
        this.jFeetunitOptions = res.data.cntrList
      }
      if (res.data.fees) {
        this.fFeeid_s = res.data.fees
      }
    })
    this.getList()
  },
  methods: {
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
      this.query.pageSize = val
      this.getList()
    },
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
      this.query.pageNum = val
      this.getList()
    },
    getList() {
      listCorps_s(this.query).then(res => {
        this.total = res.total
        console.log(res)
        this.loading = false
        this.agreementList = res.rows
      })
    },
    corpsRemoteMethod(name) {
      if (name == null || name === '') {
        return false
      }
      let queryParams = {pageNum: 1, fName: name, fTypeid: 1}
      listCorps(queryParams).then((response) => {
        console.log(response)
        this.fMblnoOptions = response.rows
      })
    },
    corpsRemote(name) {
      if (name == null || name === '') {
        return false
      }
      let queryParams = {pageNum: 1, fName: name, fTypeid: 2}
      listCorps(queryParams).then((response) => {
        console.log(response)
        this.blnoOptions = response.rows
      })
    },
    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
        }
      }
    },
    resetQuery() {
      this.query = {
        pageNum: 1,
        pageSize: 10
      }
    },
    open() {
      this.$confirm('是否确定返回列表?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.jiGang = false
      }).catch(() => {
      })
    },
    handleSelectionChange(selection) {
      console.log(selection)
      this.selection = selection
      if (selection.length === 1) {
        this.single = false
      } else {
        this.single = true
      }
    },
    handleUpdate(row) {
      let fId
      if (this.selection.length == 1) {
        fId = this.selection[0].fId
      } else {
        fId = row.fId
      }
      single(fId).then(res => {
        if (res.code === 200) {
          this.jiGang = true
          this.queryParams = res.data.warehouseBills
          this.warehouseDrList = res.data.feesDrList
          this.warehouseCrList = res.data.feesCrList
          for (let item in this.warehouseDrList){
            this.warehouseDrList[item].fFeeunitid = this.warehouseDrList[item].fFeeunitid + ''
          }
          for (let item in this.warehouseCrList){
            this.warehouseCrList[item].fFeeunitid = this.warehouseCrList[item].fFeeunitid + ''
          }
          if (this.queryParams.fBillstatus !== 2) {
            this.disabled = true
          } else {
            this.disabled = false
          }
        }
      })
    },
    handleDelete(row) {
      singleDeletion(row.fId).then(res => {
        console.log(res)
        if (res.code === 200){
          this.$message.success(res.msg);
          this.getList()
        }
      })
    },
    handleAdd() {
      this.jiGang = true
      this.disabled = false
      this.queryParams = {}
      this.warehouseDrList = []
      this.warehouseCrList = []
    },
    addpayment() {
      this.warehouseCrList.push({
        fCorpid:'',
        fFeeid:'',
        fFeeUnitid:'',
        fUnitprice:'',
        fAmt:'',
        fExrate:'',
        remark:'',
        fCurrency:'1'
      })
      this.fWbuOptions = []
      let queryParams = {pageNum: 1, fDc: 'C'}
      listFees(queryParams).then((response) => {
        this.fCNameOptions = response.rows
      })
    },
    deleteRow(index, rows) {
      rows.splice(index, 1)
    },
    submitForm() {
      this.$refs["rules"].validate((valid) => {
        if (valid) {
          let formDatae = new window.FormData()
          formDatae.append('warehouseBills', JSON.stringify(this.queryParams))
          formDatae.append('feesDr', JSON.stringify(this.warehouseDrList))
          formDatae.append('feesCr', JSON.stringify(this.warehouseCrList))
          preservation(formDatae).then(res => {
            console.log(res)
            if (res.code === 200) {
              this.$message.success('保存成功');
              this.getList()
              this.jiGang = false
            }
          })
        }
      });
    },
    submit() {
      this.$refs["rules"].validate((valid) => {
        if (valid) {
          let formDatae = new window.FormData()
          formDatae.append('warehouseBills', JSON.stringify(this.queryParams))
          formDatae.append('feesDr', JSON.stringify(this.warehouseDrList))
          formDatae.append('feesCr', JSON.stringify(this.warehouseCrList))
          submit(formDatae).then(res => {
            console.log(res)
            if (res.code === 200) {
              this.$message.success('提交成功');
              this.getList()
              this.jiGang = false
            }
          })
        }
      });
    },
    cancellation() {
      // let formDatae = new window.FormData()
      // formDatae.append('warehouseBills', JSON.stringify(this.queryParams))
      // formDatae.append('feesDr', JSON.stringify(this.warehouseDrList))
      // formDatae.append('feesCr', JSON.stringify(this.warehouseCrList))
      revokeContainerPort(this.queryParams.fId).then(res => {
        console.log(res)
        if (res.code === 200) {
          this.$message.success('撤销成功');
          this.getList()
          this.jiGang = false
        }
      })
    },
    calculation(row) {
      console.log(row)
      if (row.fQty && row.fUnitprice) {
        row.fAmt = Number(row.fQty) * Number(row.fUnitprice)
      }
    },
    addCollection() {
      this.warehouseDrList.push({
        fCorpid:'',
        fFeeid:'',
        fFeeUnitid:'',
        fUnitprice:'',
        fAmt:'',
        fExrate:'',
        remark:'',
        fCurrency:'1'
      })
      this.fWbuOptions = []
      let queryParams = {pageNum: 1, fDc: 'D'}
      listFees(queryParams).then((response) => {
        this.fDNameOptions = response.rows
      })
    },
    // 付款合计
    warehouseDrSummaries(param) {
      const {columns, data} = param
      const sums = []
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = '合计'
          return
        }
        const values = data.map((item) => Number(item[column.property]))
        if (
          column.property === 'fUnitprice' ||
          column.property === 'fAmount' ||
          column.property === 'fQty' ||
          column.property === 'fQty' ||
          column.property === 'fAmt'
        ) {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr)
            if (!isNaN(value)) {
              return prev + curr
            } else {
              return prev
            }
          }, 0)
          sums[index] = sums[index].toFixed(2)
        }
      })
      return sums
    },
  }
}
</script>

<style scoped lang="scss">
</style>
