<template>
  <div>
    <el-card>
      <div>
        <span style="margin-left: 10px">供应商:</span>
        <el-select v-model="supplierNameValue" placeholder="供应商" size="small" filterable clearable @change="pageCurrent4=1;pageSize4=10;total4=0;searchTable4()">
          <el-option
            v-for="item in supplierName"
            :key="item.value"
            :label="item.label"
            :value="item.value"/>
        </el-select>
        <!--<el-input v-model="Name" placeholder="供应商" size="small" clearable/>-->
        <!--<span>关联情况:</span>-->
        <!--<el-select v-model="PickingValue" placeholder="关联情况" size="small" clearable>-->
        <!--<el-option-->
        <!--v-for="item in Picking"-->
        <!--:key="item.value"-->
        <!--:label="item.label"-->
        <!--:value="item.value"/>-->
        <!--</el-select>-->
        <!--<el-tooltip :open-delay="1200" effect="dark" content="查询到货单" placement="top">-->
        <!--<el-button type="success" size="small" icon="el-icon-search" style="margin-left: 10px" @click="pageCurrent4=1;pageSize4=10;total4=0;searchTable4()">查询</el-button>-->
        <!--</el-tooltip>-->
        <el-button type="primary" size="small" icon="el-icon-plus" style="margin-left: 10px" @click="addArrivalOrder">新增到货单</el-button>
      </div>
    </el-card>
    <el-card style="width: 45%;float: left">
      <span>到货单</span>
      <el-table v-loading="" :data="tableData4" border stripe style="width: 100%" height="230px" size="mini" highlight-current-row @row-click="searchTable5">
        <el-table-column label="关联情况" align="center" width="80">
          <template slot-scope="scope">
            <el-tag v-if="Number(scope.row.是否关联) === 1" type="success" size="mini">已结算</el-tag>
            <el-tag v-else type="primary" size="mini">未结算</el-tag>
          </template>
        </el-table-column>
        <el-table-column label="供应商" prop="供应商名称" align="center" width="200">
          <template slot-scope="scope">
            {{ scope.row.供应商名称 }}
          </template>
        </el-table-column>
        <el-table-column label="到货日期" prop="到货日期" align="center" width="100">
          <template slot-scope="scope">
            {{ scope.row.日期.split(' ')[0] }}
          </template>
        </el-table-column>
        <el-table-column label="到货单号" align="center" width="150">
          <template slot-scope="scope">
            {{ scope.row.到货单编号 }}
          </template>
        </el-table-column>
        <el-table-column label="操作" align="center" width="200" fixed="right">
          <template slot-scope="scope">
            <el-button :disabled="Number(scope.row.是否关联) === 1" type="text" size="mini" style="margin-left: 10px" icon="el-icon-circle-plus-outline" @click="addArrivalOrderMX(scope.row)">到货明细</el-button>
            <el-button :disabled="Number(scope.row.是否关联) === 1" type="text" size="mini" style="margin-left: 20px" icon="el-icon-delete" @click="deleteArrivalOrder(scope.row)">删除</el-button>
          </template>
        </el-table-column>
      <!--</el-tooltip>-->
      <!--<el-tooltip :open-delay="1200" effect="dark" content="编辑" placement="top">-->
        <!--<div style="display: inline-block">-->
        <!--<el-button :disabled="Number(scope.row.是否关联) === 1" type="text" size="mini" style="margin-left: 20px" icon="el-icon-edit-outline" @click="editArrivalOrder(scope.row)"/>-->
        <!--</div>-->
      <!--</el-tooltip>-->
      <!--<el-tooltip :open-delay="1200" effect="dark" content="删除" placement="top">-->
        <!--<div style="display: inline-block">-->
        <!--<el-button :disabled="Number(scope.row.是否关联) === 1" type="text" size="mini" style="margin-left: 20px" icon="el-icon-delete" @click="deleteArrivalOrder(scope.row)"/>-->
        <!--</div>-->
      <!--</el-tooltip>-->
        <!--</template>-->
      <!--</el-table-column>-->
      </el-table>
      <div class="block">
        <el-pagination
          :current-page="pageCurrent4"
          :page-sizes="[10, 20, 30, 40]"
          :page-size="pageSize4"
          :total="total4"
          style="display:inline-block;width:50%"
          layout="total, sizes, prev, pager, next, jumper"
          @size-change="handleSizeChange4"
          @current-change="handleCurrentChange4"/>
      </div>
    </el-card>
    <el-card style="width: 54%;float: left;margin-left: 10px">
      <span>到货单明细</span>
      <el-table
        v-loading=""
        :data="tableData5"
        :summary-method="getSummaries"
        border
        show-summary
        highlight-current-row
        stripe
        style="margin: 3px 0"
        height="260px"
        size="mini"
        @row-click="searchTable6">
        <el-table-column width="60" align="center" type="index" label="序号"/>
        <el-table-column label="材料" prop="材料" align="center" width="200">
          <template slot-scope="scope">
            {{ scope.row.材料 }}
          </template>
        </el-table-column>
        <el-table-column label="数量" align="center" prop="数量">
          <template slot-scope="scope">
            {{ scope.row.数量 }}
          </template>
        </el-table-column>
        <el-table-column label="单位" align="center" >
          <template slot-scope="scope">
            {{ scope.row.单位 }}
          </template>
        </el-table-column>
        <el-table-column label="单价" align="right">
          <template slot-scope="scope">
            {{ scope.row.单价.toFixed(2) }}
          </template>
        </el-table-column>
        <el-table-column label="金额" align="right">
          <template slot-scope="scope">
            {{ (parseInt(scope.row.金额 * 100) / 100).toFixed(2) }}
          </template>
        </el-table-column>
        <el-table-column label="操作" align="center" width="220" fixed="right">
          <template slot-scope="scope">
            <el-tooltip :open-delay="1200" effect="dark" content="关联备料材料" placement="top">
              <div style="display: inline-block">
                <el-button :disabled="disable === '1'" type="text" size="mini" icon="el-icon-circle-plus-outline" @click="addArrivalCL(scope.row)">备料材料</el-button>
              </div>
            </el-tooltip>
            <el-tooltip :open-delay="1200" effect="dark" content="删除" placement="top">
              <div style="display: inline-block">
                <el-button :disabled="disable === '1'" type="text" size="mini" style="margin-left: 20px" icon="el-icon-delete" @click="deleteArrivalMX(scope.row)"/>
              </div>
            </el-tooltip>
          </template>
        </el-table-column>
      </el-table>
    </el-card>
    <el-card style="width: 100%">
      <span>关联备料材料</span>
      <el-table
        v-loading=""
        :data="tableData6"
        :summary-method="getSummaries1"
        border
        show-summary
        highlight-current-row
        stripe
        style="margin: 3px 0"
        height="500px"
        size="mini">
        <el-table-column label="物料编码" prop="物料零件编码" align="center" width="200">
          <template slot-scope="scope">
            {{ scope.row.物料零件编码 }}
          </template>
        </el-table-column>
        <el-table-column label="零件名称" prop="零件名称" align="center">
          <template slot-scope="scope">
            {{ scope.row.零件名称 }}
          </template>
        </el-table-column>
        <el-table-column label="材料" prop="材料" align="center" >
          <template slot-scope="scope">
            {{ scope.row.材料 }}
          </template>
        </el-table-column>
        <el-table-column label="数量" align="center">
          <template slot-scope="scope">
            {{ scope.row.数量 }}
          </template>
        </el-table-column>
        <el-table-column label="成品尺寸（长、宽、高）" align="center">
          <template slot-scope="scope">
            {{ scope.row.成品尺寸 }}
          </template>
        </el-table-column>
        <el-table-column label="总重量" align="center" prop="总重量">
          <template slot-scope="scope">
            {{ scope.row.重量 }}
          </template>
        </el-table-column>
        <el-table-column label="单位" align="center" >
          <template slot-scope="scope">
            {{ scope.row.单位 }}
          </template>
        </el-table-column>
        <el-table-column label="总金额" align="center" prop="总金额">
          <template slot-scope="scope">
            {{ (parseInt(scope.row.金额 * 100) / 100).toFixed(2) }}
          </template>
        </el-table-column>
        <el-table-column label="备注" align="center" >
          <template slot-scope="scope">
            {{ scope.row.备注 }}
          </template>
        </el-table-column>
        <el-table-column label="操作" align="center" width="110px" fixed="right">
          <template slot-scope="scope">
            <el-tooltip effect="dark" content="取消关联" placement="top">
              <div style="display: inline-block">
                <el-button :disabled="disable === '1'" type="text" size="mini" @click="deleteMateriel(scope.row)">取消关联</el-button>
              </div>
            </el-tooltip>
          </template>
        </el-table-column>
      </el-table>
    </el-card>

    <el-dialog v-el-drag-dialog :title="title" :visible.sync="dialogVisible" center style="min-height: 400px" width="380px">
      <el-form ref="form" :model="form" :rules="rules" label-position="right" label-width="80px">
        <el-row>
          <el-form-item label="供应商" prop="supplierNameValue">
            <el-select v-show="title==='新增到货单'" v-model="form.supplierNameValue" placeholder="供应商" size="small" filterable @change="searchTable20()">
              <el-option
                v-for="item in supplierNames"
                :key="item.value"
                :label="item.label"
                :value="item.value"/>
            </el-select>
          </el-form-item>
        </el-row>
        <el-row>
          <el-form-item label="到货日期" prop="invoiceTime">
            <el-date-picker v-model="form.日期" size="small" type="date" value-format="yyyy-MM-dd" format="yyyy-MM-dd" placeholder="选择日期"/>
          </el-form-item>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button
          v-show="title==='新增到货单'"
          type="primary"
          size="small"
          icon="el-icon-check"
          @click="submitAddArrivalOrder">保存</el-button>
        <el-button
          v-show="title==='编辑到货单'"
          type="primary"
          size="small"
          icon="el-icon-check"
          @click="submitEditArrivalOrder">确定</el-button>
      </div>
    </el-dialog>
    <el-dialog v-el-drag-dialog :visible.sync="dialogVisible10" title="添加到货明细" center style="min-height: 400px" width="1600px">
      <el-form ref="form10" :model="form10" :rules="rules10" label-position="right" label-width="60px">
        <el-row>
          <el-col :span="5" style="margin-left: 2%">
            <span>供应商</span>
            <el-input v-model="供应商名称" style="width: 250px" size="small" readonly/>
          </el-col>
          <el-col :span="4">
            <span>到货单编号</span>
            <el-input v-model="到货单编号" style="width: 150px" size="small" readonly/>
          </el-col>
          <el-col :span="4">
            <span>计划类型</span>
            <el-select v-model="planType" placeholder="计划类型" size="small" style="width: 150px" filterable @change="searchTable20()">
              <el-option
                v-for="item in planTypes"
                :key="item.value"
                :label="item.label"
                :value="item.value"/>
            </el-select>
          </el-col>
          <el-col :span="4">
            <span>零件图号</span>
            <el-input v-model="零件图号" style="width: 150px" size="small" clearable/>
          </el-col>
          <el-col :span="2">
            <el-button type="success" size="small" icon="el-icon-search" style="margin-left: 10px" @click="searchTable20()">查询</el-button>
          </el-col>
        </el-row>
        <el-row>
          <div style="width: 20%;float: left;margin-top: 20px">
            <div style="background: gainsboro">
              <el-row style="height: 50px">
                <el-form-item label="材料" prop="CailiaoValue">
                  <el-input v-model="form10.CailiaoValue" size="small"/>
                </el-form-item>
              </el-row>
              <el-row style="height: 50px">
                <el-form-item label="数量" prop="数量">
                  <el-input-number v-model="form10.数量" :precision="2" :step="1" :min="0" size="medium" @change="Calculation"/>
                </el-form-item>
              </el-row>
              <el-row style="height: 50px">
                <el-form-item label="单价" prop="单价">
                  <el-input-number v-model="form10.单价" :precision="2" :step="1" :min="0" size="medium" @change="Calculation"/>
                </el-form-item>
              </el-row>
              <el-row style="height: 50px">
                <el-form-item label="单位" prop="单位">
                  <el-input v-model="form10.单位" size="small"/>
                </el-form-item>
              </el-row>
              <el-row style="height: 50px">
                <el-form-item label="金额" prop="金额">
                  <el-input-number v-model="form10.金额" :precision="2" :step="1" size="medium"/>
                </el-form-item>
              </el-row>
            </div>
            <div>
              <el-button type="primary" size="small" style="margin-left: 40%;margin-top: 10px" @click="submitAddArrivalOrderMX">确定</el-button>
            </div>
          </div>
          <div style="width: 79%;float: left;margin-left: 10px">
            <el-table :row-key="getRowKeys" :data="tableData20" border show-summary highlight-current-row stripe style="margin: 3px 0" height="550px" size="mini" @selection-change="handleSelectionChange">
              <el-table-column :reserve-selection="true" type="selection" width="50" align="center"/>
              <el-table-column label="采购单号" align="center" width="120">
                <template slot-scope="scope">
                  {{ scope.row.采购单号 }}
                </template>
              </el-table-column>
              <el-table-column label="物料编码" align="center" width="150">
                <template slot-scope="scope">
                  {{ scope.row.物料零件编码 }}
                </template>
              </el-table-column>
              <el-table-column label="零件名称" align="center" width="90px">
                <template slot-scope="scope">
                  {{ scope.row.零件名称 }}
                </template>
              </el-table-column>
              <el-table-column label="材料" align="center" width="70px">
                <template slot-scope="scope">
                  {{ scope.row.材料 }}
                </template>
              </el-table-column>
              <el-table-column label="备料件数" align="center" width="70px">
                <template slot-scope="scope">
                  {{ scope.row.采购数量 }}
                </template>
              </el-table-column>
              <el-table-column label="已到件数" align="center" width="70px">
                <template slot-scope="scope">
                  {{ scope.row.到货数量 }}
                </template>
              </el-table-column>
              <el-table-column label="到货件数" align="center" width="110px">
                <template slot-scope="scope">
                  <el-input-number v-model="scope.row.未到货数量" :disabled="disable === '1'" :max="scope.row.采购数量-parseInt(scope.row.到货数量)" :step="1" :min="0" size="mini" style="width:90px" @change="saveData(scope.row)"/>
                </template>
              </el-table-column>
              <el-table-column label="到货重量" align="center" width="110px" prop="到货重量">
                <template slot-scope="scope">
                  <el-input-number v-model="scope.row.到货重量" :disabled="disable === '1'" :step="1" :min="0" size="mini" style="width:90px" @change="saveData(scope.row)"/>
                </template>
              </el-table-column>
              <el-table-column label="成品尺寸（长、宽、高）" align="center">
                <template slot-scope="scope">
                  {{ scope.row.成品尺寸 }}
                </template>
              </el-table-column>
              <el-table-column label="单位" align="center" width="60px">
                <template slot-scope="scope">
                  {{ scope.row.单位 ? scope.row.单位 : '-' }}
                </template>
              </el-table-column>
              <el-table-column label="备注" align="center">
                <template slot-scope="scope">
                  {{ scope.row.备注1 }}
                </template>
              </el-table-column>
            </el-table>
          </div>
        </el-row>
      </el-form>
    </el-dialog>

    <!--<el-dialog v-el-drag-dialog :title="title1" :visible.sync="dialogVisible1" center style="min-height: 200px" width="430px">-->
    <!--<el-form ref="form1" :model="form1" :rules="rules1" label-position="right" label-width="120px">-->
    <!--<el-row>-->
    <!--<el-form-item v-show="title1==='添加到货明细'" label="材料" prop="CailiaoValue">-->
    <!--<el-input v-model="form1.CailiaoValue" size="small"/>-->
    <!--</el-form-item>-->
    <!--</el-row>-->
    <!--<el-row>-->
    <!--<el-form-item label="数量" prop="数量">-->
    <!--<el-input-number v-model="form1.数量" :precision="2" :step="1" :min="0" size="medium" @change="Calculation"/>-->
    <!--</el-form-item>-->
    <!--</el-row>-->
    <!--<el-row>-->
    <!--<el-form-item label="单价" prop="单价">-->
    <!--<el-input-number v-model="form1.单价" :precision="2" :step="1" :min="0" size="medium" @change="Calculation"/>-->
    <!--</el-form-item>-->
    <!--</el-row>-->
    <!--<el-row>-->
    <!--<el-form-item label="单位" prop="单位">-->
    <!--<el-input v-model="form1.单位" size="small"/>-->
    <!--</el-form-item>-->
    <!--</el-row>-->
    <!--<el-row>-->
    <!--<el-form-item label="金额" prop="金额">-->
    <!--<el-input-number v-model="form1.金额" :precision="2" :step="1" size="medium"/>-->
    <!--</el-form-item>-->
    <!--</el-row>-->
    <!--</el-form>-->
    <!--<div slot="footer" class="dialog-footer">-->
    <!--<el-button-->
    <!--v-show="title1==='添加到货明细'"-->
    <!--type="warning"-->
    <!--size="small"-->
    <!--plain-->
    <!--icon="el-icon-check"-->
    <!--@click="submitAddArrivalOrderMX">保存</el-button>-->
    <!--<el-button-->
    <!--v-show="title1==='添加到货明细'"-->
    <!--type="primary"-->
    <!--plain-->
    <!--size="small"-->
    <!--icon="el-icon-check"-->
    <!--@click="submitAddArrivalOrderMX1">继续添加</el-button>-->
    <!--<el-button-->
    <!--v-show="title1==='编辑到货明细'"-->
    <!--type="primary"-->
    <!--size="small"-->
    <!--icon="el-icon-check"-->
    <!--@click="submitEditArrivalOrderMX">确定</el-button>-->
    <!--</div>-->
    <!--</el-dialog>-->

    <el-dialog v-el-drag-dialog :visible.sync="dialogVisible2" title="关联备料材料" center style="min-height: 550px" width="1400px">
      <span>计划类型</span>
      <el-select v-model="planType" placeholder="计划类型" size="small" style="width: 150px" filterable @change="searchTable20()">
        <el-option
          v-for="item in planTypes"
          :key="item.value"
          :label="item.label"
          :value="item.value"/>
      </el-select>
      <span>零件图号</span>
      <el-input v-model="零件图号" style="width: 150px" size="small" clearable/>
      <el-button type="success" size="small" icon="el-icon-search" style="margin-left: 10px" @click="searchTable20()">查询</el-button>
      <el-table :row-key="getRowKeys" :data="tableData20" border highlight-current-row stripe style="margin: 3px 0" height="300px" size="mini" @selection-change="handleSelectionChange">
        <el-table-column :reserve-selection="true" type="selection" width="50" align="center"/>
        <el-table-column label="采购单号" align="center" width="120">
          <template slot-scope="scope">
            {{ scope.row.采购单号 }}
          </template>
        </el-table-column>
        <el-table-column label="物料编码" align="center" width="150">
          <template slot-scope="scope">
            {{ scope.row.物料零件编码 }}
          </template>
        </el-table-column>
        <el-table-column label="零件名称" align="center" width="90px">
          <template slot-scope="scope">
            {{ scope.row.零件名称 }}
          </template>
        </el-table-column>
        <el-table-column label="材料" align="center" width="70px">
          <template slot-scope="scope">
            {{ scope.row.材料 }}
          </template>
        </el-table-column>
        <el-table-column label="备料件数" align="center" width="70px">
          <template slot-scope="scope">
            {{ scope.row.采购数量 }}
          </template>
        </el-table-column>
        <el-table-column label="已到件数" align="center" width="70px">
          <template slot-scope="scope">
            {{ scope.row.到货数量 }}
          </template>
        </el-table-column>
        <el-table-column label="到货件数" align="center" width="110px">
          <template slot-scope="scope">
            <el-input-number v-model="scope.row.未到货数量" :disabled="disable === '1'" :max="scope.row.采购数量-parseInt(scope.row.到货数量)" :step="1" :min="0" size="mini" style="width:90px" @change="saveData(scope.row)"/>
          </template>
        </el-table-column>
        <el-table-column label="到货重量" align="center" width="110px">
          <template slot-scope="scope">
            <el-input-number v-model="scope.row.到货重量" :disabled="disable === '1'" :step="1" :min="0" size="mini" style="width:90px" @change="saveData(scope.row)"/>
          </template>
        </el-table-column>
        <el-table-column label="成品尺寸（长、宽、高）" align="center">
          <template slot-scope="scope">
            {{ scope.row.成品尺寸 }}
          </template>
        </el-table-column>
        <el-table-column label="单位" align="center" width="60px">
          <template slot-scope="scope">
            {{ scope.row.单位 ? scope.row.单位 : '-' }}
          </template>
        </el-table-column>
        <el-table-column label="备注" align="center">
          <template slot-scope="scope">
            {{ scope.row.备注1 }}
          </template>
        </el-table-column>
      </el-table>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" size="small" icon="el-icon-download" style="margin-left: 10px" @click="addMateriel">选入备料材料</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { searchPurchaseOrder, searchMateriel, addMateriel, searchArriveOrder, addPurchaseOrder, editPurchaseOrder, deletePurchaseOrder, searchTable5,
  searchSupplier, deleteArrivalMX, EditArrivalOrderMX, AddArrivalOrderMX, deleteMateriel, searchTable6, searchLxPurchaseOrder, searchLxMateriel } from '@/api/WorkshopProcurement/NewArrivalList.js'
import { mapGetters } from 'vuex'

export default {
  data() {
    return {
      supplierNameValue: '',
      supplierName: [], // 供应商
      partNumber: '',
      purchasingOrder: '',
      ArrivalOrderNumber: '',
      ArrivalOrderMXNumber: '',
      supplierName0: '',
      planType: 0,
      planTypes: [
        {
          value: 0,
          label: '采购计划'
        },
        {
          value: 1,
          label: '离线采购计划'
        }
      ],
      arrest: [],
      check: 0,
      Name: '',
      单价: '',
      数量: '',
      供应商: '',
      SUM: 0,
      PickingValue: '',
      Picking: [{
        value: 0,
        label: '未结算'
      }, {
        value: 1,
        label: '已结算'
      }],
      ALLMoney: '',
      材料名称: '',
      未绑定数量: '',
      零件图号: '',
      tableData2: [],
      total2: 0,
      pageCurrent2: 1,
      pageSize2: 10,
      tableData6: [],
      tableData20: [],
      tableData30: [],
      采购计划流水号: '',
      离线采购计划流水号: '',
      tableData4: [],
      total4: 0,
      pageCurrent4: 1,
      pageSize4: 10,
      tableData5: [],
      到货单流水号: '',
      中间变量: '',
      form: {
        supplierNameValue: '',
        备注: '',
        日期: ''
      },
      form1: {
        CailiaoValue: '',
        数量: '',
        单位: 'KG',
        单价: '',
        金额: ''
      },
      form10: {
        CailiaoValue: '',
        数量: '',
        单位: 'KG',
        单价: '',
        金额: ''
      },
      allWeight: '',
      supplierNames: [],
      dialogVisible: false,
      dialogVisible1: false,
      dialogVisible10: false,
      dialogVisible2: false,
      title: '',
      title1: '',
      disable: '',
      rules: {
        supplierNameValue: [{ required: true, message: '请选择供应商' }],
        日期: [{ required: true, message: '请选择日期' }]
      },
      rules1: {
        CailiaoValue: [{ required: true, message: '请填写材料' }],
        数量: [{ required: true, message: '请填写数量' }],
        单位: [{ required: true, message: '请填写单位' }],
        单价: [{ required: true, message: '请填写单价' }]
      },
      rules10: {
        CailiaoValue: [{ required: true, message: '请填写材料' }],
        数量: [{ required: true, message: '请填写数量' }],
        单位: [{ required: true, message: '请填写单位' }],
        单价: [{ required: true, message: '请填写单价' }]
      },
      到货单编号: '',
      供应商名称: '',
      本次到货数量组: [],
      到货重量组: [],
      工艺计划流水号组: [],
      采购计划明细流水号组: [],
      离线采购计划明细流水号组: [],
      到货金额组: [],
      getRowKeys(row) {
        return row.采购计划明细流水号
      }
    }
  },
  computed: {
    ...mapGetters([
      'sidebar',
      'avatar',
      'name',
      'userId',
      'id' // 人员编号
    ])
  },
  created() {
    this.fetchdata()
    this.searchTable2()
    this.searchTable4()
  },
  methods: {
    saveData(row) {
      var a = 0
      this.tableData30.map(v => {
        if (v.采购计划明细流水号 === row.采购计划明细流水号) {
          v.到货重量 = row.到货重量
          v.未到货数量 = row.未到货数量
          a = 1
        }
      })
      if (a === 0) {
        this.tableData30.push({
          采购计划明细流水号: row.采购计划明细流水号,
          到货重量: row.到货重量,
          未到货数量: row.未到货数量
        })
      }
    },
    fetchdata() {
      searchSupplier(0, '', 0, '', 0, '', 0, '', 0, '', 0, '', 0, '', 0, '', 0, '', 0, '', 0, '', 0, '').then(response => {
        for (let i = 0; i < response.data.length; i++) {
          this.supplierName.push({
            label: response.data[i].供应商名称,
            value: response.data[i].供应商流水号
          })
        }
      })
    },
    searchTable20() {
      let check
      this.零件图号 ? check = 1 : check = 0
      if (this.planType === 0) {
        searchMateriel(this.供应商, check, this.零件图号).then(response => {
          this.tableData20 = response.data
          for (let i = 0; i < this.tableData20.length; i++) {
            for (let j = 0; j < this.tableData30.length; j++) {
              if (this.tableData20[i].采购计划明细流水号 === this.tableData30[j].采购计划明细流水号) {
                this.tableData20[i].未到货数量 = this.tableData30[j].未到货数量
                this.tableData20[i].到货重量 = this.tableData30[j].到货重量
              }
            }
          }
        })
      } else {
        searchLxMateriel(this.供应商, check, this.零件图号).then(response => {
          this.tableData20 = response.data
        })
      }
    },
    searchTable2() { // 查询采购单列表
      if (this.planType === 0) {
        this.purchasingOrder ? this.check3 = 1 : this.check3 = 0
        this.supplierName0 ? this.check4 = 1 : this.check4 = 0
        this.partNumber ? this.check5 = 1 : this.check5 = 0
        searchPurchaseOrder(this.pageCurrent2, this.pageSize2, this.check3, this.purchasingOrder, this.check4, this.supplierName0, this.check5, this.partNumber).then(response => {
          this.tableData2 = response.data.rows
          this.total2 = response.data.total
        })
      } else {
        this.purchasingOrder ? this.check3 = 1 : this.check3 = 0
        this.supplierName0 ? this.check4 = 1 : this.check4 = 0
        this.partNumber ? this.check5 = 1 : this.check5 = 0
        searchLxPurchaseOrder(this.pageCurrent2, this.pageSize2, this.check3, this.purchasingOrder, this.check4, this.supplierName0, this.check5, this.partNumber).then(response => {
          this.tableData2 = response.data.rows
          this.total2 = response.data.total
        })
      }
    },
    handleSizeChange2(val) { // 采购单列表分页
      this.pageSize2 = val
      this.searchTable2()
    },
    handleCurrentChange2(val) { // 采购单列表分页
      this.pageCurrent2 = val
      this.searchTable2()
    },
    getSummaries(param) {
      const { columns, data } = param
      const sums = []
      columns.forEach((column, index) => {
        if (index === 1) {
          sums[index] = '总数量：'
          return
        } else if (index === 2) {
          const values = data.map(item => Number(item['数量']))
          if (!values.every(value => isNaN(value))) {
            sums[index] = values.reduce((prev, curr) => {
              const value = Number(curr)
              if (!isNaN(value)) {
                return Number(prev) + Number(curr)
              } else {
                return Number(prev)
              }
            }, 0)
            sums[index]
          } else {
            sums[index] = 'N/A'
          }
        } else if (index === 4) {
          sums[index] = '总金额：'
          return
        } else if (index === 5) {
          const values = data.map(item => Number(item['金额']))
          if (!values.every(value => isNaN(value))) {
            sums[index] = values.reduce((prev, curr) => {
              const value = Number(curr)
              if (!isNaN(value)) {
                return (parseInt((Number(prev) + Number(curr)) * 100) / 100).toFixed(2)
              } else {
                return (parseInt(Number(prev) * 100) / 100).toFixed(2)
              }
            }, 0)
            sums[index] += ' 元'
          } else {
            sums[index] = 'N/A'
          }
        }
      })
      return sums
    },
    getSummaries1(param) {
      const { columns, data } = param
      const sums = []
      columns.forEach((column, index) => {
        if (index === 3) {
          sums[index] = '未绑定重量：'
          return
        } else if (index === 4) {
          sums[index] = this.未绑定数量
        } if (index === 5) {
          sums[index] = '绑定重量：'
          return
        } else if (index === 6) {
          const values = data.map(item => Number(item['重量']))
          if (!values.every(value => isNaN(value))) {
            sums[index] = values.reduce((prev, curr) => {
              const value = Number(curr)
              if (!isNaN(value)) {
                return parseInt((Number(prev) + Number(curr)) * 100) / 100
              } else {
                return parseInt(Number(prev) * 100) / 100
              }
            }, 0)
            sums[index]
          } else {
            sums[index] = 'N/A'
          }
        } else if (index === 7) {
          sums[index] = '总金额：'
          return
        } else if (index === 8) {
          const values = data.map(item => Number(item['金额']))
          if (!values.every(value => isNaN(value))) {
            sums[index] = values.reduce((prev, curr) => {
              const value = Number(curr)
              if (!isNaN(value)) {
                return (parseInt((Number(prev) + Number(curr)) * 100) / 100).toFixed(2)
              } else {
                return (parseInt(Number(prev) * 100) / 100).toFixed(2)
              }
            }, 0)
            sums[index] += ' 元'
          } else {
            sums[index] = 'N/A'
          }
        }
      })
      return sums
    },
    // 查询到货单
    searchTable4() {
      this.tableData5 = []
      this.tableData6 = []
      this.supplierNameValue ? this.check = 1 : this.check = 0
      if (this.PickingValue === 0 || this.PickingValue === 1) {
        this.check2 = 1
      } else {
        this.check2 = 0
      }
      searchArriveOrder(this.check, this.supplierNameValue, this.check2, this.PickingValue, this.pageCurrent4, this.pageSize4).then(response => {
        this.tableData4 = response.data.rows
        this.total4 = response.data.total
      })
    },
    Calculation() {
      this.form10.金额 = this.form10.单价 * this.form10.数量
    },
    handleSizeChange4(val) { // 采购单列表分页
      this.pageSize4 = val
      this.pageCurrent4 = 1
      this.searchTable4()
    },
    handleCurrentChange4(val) { // 采购单列表分页
      this.pageCurrent4 = val
      this.searchTable4()
    },
    // 创建采购单
    addArrivalOrder() {
      if (this.$refs['form'] !== undefined) {
        this.$refs['form'].resetFields()
      }
      this.title = '新增到货单'
      this.form.备注 = ''
      this.form.supplierNameValue = ''
      this.supplierNames = []
      this.dialogVisible = true
      searchSupplier(0, '', 0, '', 0, '', 0, '', 0, '', 0, '', 0, '', 0, '', 0, '', 0, '', 0, '', 0, '').then(response => {
        for (let i = 0; i < response.data.length; i++) {
          this.supplierNames.push({
            label: response.data[i].供应商名称,
            value: response.data[i].供应商流水号
          })
        }
      })
    },
    // 新增
    submitAddArrivalOrder() {
      this.$refs['form'].validate((valid) => {
        if (valid) {
          addPurchaseOrder(this.form.备注, this.form.supplierNameValue, this.form.日期).then(response => {
            if (response.data[0].result === '1') {
              this.$message.success('新建到货单成功')
              this.pageCurrent4 = 1
              this.pageSize4 = 10
              this.searchTable4()
              this.dialogVisible = false
            } else { this.$message.error('新建到货单失败') }
          })
        } else {
          return false
        }
      })
    },
    // 编辑
    editArrivalOrder(row) {
      if (this.$refs['form'] !== undefined) {
        this.$refs['form'].resetFields()
      }
      this.title = '编辑到货单'
      this.form.备注 = row.备注
      this.form.日期 = row.日期
      this.dialogVisible = true
    },
    submitEditArrivalOrder() {
      this.$refs['form'].validate((valid) => {
        if (valid) {
          editPurchaseOrder(this.form.备注, this.到货单流水号, this.form.日期).then(response => {
            if (response.data[0].result === '1') {
              this.$message.success('修改到货单成功')
              this.searchTable4()
              this.dialogVisible = false
            } else { this.$message.error('修改到货单失败') }
          })
        } else {
          return false
        }
      })
    },
    deleteArrivalOrder(row) { // 删除采购单
      this.$confirm('确定删除该到货单?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        deletePurchaseOrder(row.到货单流水号).then(response => {
          if (response.data[0].result === '1') {
            this.$message.success('删除成功')
            this.searchTable4()
            this.tableData5 = []
            this.tableData6 = []
          } else { this.$message.error('数据占用，删除失败') }
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        })
      })
    },
    searchTable5(row) {
      console.log(this.userId, this.id)
      this.disable = row.是否关联
      console.log(this.disable)
      this.tableData6 = []
      this.到货单流水号 = row.到货单流水号
      this.ArrivalOrderNumber = row.到货单流水号
      searchTable5(this.到货单流水号).then(response => {
        this.tableData5 = response.data
      })
    },
    addArrivalOrderMX(row) {
      if (this.$refs['form10'] !== undefined) {
        this.$refs['form10'].resetFields()
      }
      this.form10.CailiaoValue = ''
      this.form10.数量 = ''
      this.form10.单价 = ''
      this.form10.金额 = ''
      this.供应商 = row.供应商流水号
      this.供应商名称 = row.供应商名称
      this.到货单编号 = row.到货单编号
      this.ArrivalOrderNumber = row.到货单流水号
      this.dialogVisible10 = true
      this.searchTable20()
    },
    submitAddArrivalOrderMX() {
      if (this.form10.数量 > 0) {
        this.form10.金额 = this.form10.数量 * this.form10.单价
        this.$refs['form10'].validate((valid) => {
          if (valid) {
            if (this.arrest.length === 0) {
              this.$message.warning('请勾选要绑定的材料')
            } else {
              this.工艺计划流水号组 = []
              this.采购计划明细流水号组 = []
              this.离线采购计划明细流水号组 = []
              this.本次到货数量组 = []
              this.到货重量组 = []
              this.到货金额组 = []
              this.arrest.map(v => {
                this.工艺计划流水号组.push(v.工艺计划流水号)
                this.采购计划明细流水号组.push(v.采购计划明细流水号)
                this.离线采购计划明细流水号组.push(v.离线采购计划明细流水号)
                this.本次到货数量组.push(v.未到货数量)
                this.到货重量组.push(v.到货重量)
                this.到货金额组.push(v.到货重量 * this.form10.单价)
              })
              AddArrivalOrderMX(this.ArrivalOrderNumber, this.form10.CailiaoValue, this.form10.数量, this.form10.单位, this.form10.单价, this.form10.金额, this.工艺计划流水号组, this.采购计划明细流水号组, this.本次到货数量组, this.离线采购计划明细流水号组, this.到货重量组, this.到货金额组, this.userId).then(response => {
                if (response.data[0].result === '1') {
                  this.$message.success('新增到货材料成功')
                  this.form10.CailiaoValue = ''
                  this.form10.数量 = ''
                  this.form10.单价 = ''
                  this.form10.金额 = ''
                  this.tableData30 = []
                  this.searchTable20()
                  this.$refs['form10'].resetFields()
                  searchTable5(this.ArrivalOrderNumber).then(response => {
                    this.tableData5 = response.data
                  })
                  // this.dialogVisible1 = false
                } else { this.$message.error('新建到货单失败') }
              })
            }
          } else {
            return false
          }
        })
      } else {
        this.$message.error('数量不能为0')
      }
    },
    submitAddArrivalOrderMX1() {
      this.form1.CailiaoValue = ''
      this.form1.数量 = ''
      this.form1.单价 = ''
      this.form1.金额 = ''
    },
    editArrivalMX(row) {
      if (this.$refs['form1'] !== undefined) {
        this.$refs['form1'].resetFields()
      }
      this.title1 = '编辑到货明细'
      // this.form1.CailiaoValue = row.材料
      this.form1.数量 = row.数量
      this.form1.单位 = row.单位
      this.form1.单价 = row.单价
      this.form1.金额 = row.金额
      this.ArrivalOrderMXNumber = row.到货单明细流水号
      this.dialogVisible1 = true
    },
    submitEditArrivalOrderMX() {
      this.form1.CailiaoValue = '1'
      this.form1.金额 = this.form1.数量 * this.form1.单价
      this.$refs['form1'].validate((valid) => {
        if (valid) {
          EditArrivalOrderMX(this.ArrivalOrderMXNumber, this.form1.数量, this.form1.单位, this.form1.单价, this.form1.金额).then(response => {
            if (response.data[0].result === '1') {
              this.$message.success('编辑到货材料成功')
              searchTable5(this.ArrivalOrderNumber).then(response => {
                this.tableData5 = response.data
              })
              this.dialogVisible1 = false
            } else { this.$message.error('编辑到货单失败') }
          })
        } else {
          return false
        }
      })
    },
    deleteArrivalMX(row) {
      this.$confirm('确定删除该到货单明细?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        deleteArrivalMX(row.到货单明细流水号).then(response => {
          if (response.data[0].result === '1') {
            this.$message.success('删除成功')
            searchTable5(this.ArrivalOrderNumber).then(response => {
              this.tableData5 = response.data
            })
          } else { this.$message.error('数据占用，删除失败') }
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        })
      })
    },
    searchTable6(row) {
      this.ArrivalOrderMXNumber = row.到货单明细流水号
      this.单价 = row.单价
      this.数量 = row.数量
      searchTable6(this.ArrivalOrderMXNumber).then(response => {
        this.tableData6 = response.data
        if (response.data.length !== 0) {
          this.中间变量 = response.data[0].单件重量
          this.未绑定数量 = response.data[0].未绑定数量
        }
      })
    },
    addArrivalCL(row) {
      this.供应商 = row.供应商流水号
      this.ArrivalOrderMXNumber = row.到货单明细流水号
      this.单价 = row.单价
      this.dialogVisible2 = true
      this.searchTable20()
    },
    handleSelectionChange(val) {
      this.arrest = val
      console.log(this.arrest)
    },
    // 选入
    addMateriel() {
      if (!this.ArrivalOrderMXNumber) {
        this.$message.warning('请选择到货材料')
      } else if (this.arrest.length === 0) {
        this.$message.warning('请勾选需要关联的材料')
      } else {
        this.工艺计划流水号组 = []
        this.采购计划明细流水号组 = []
        this.离线采购计划明细流水号组 = []
        this.本次到货数量组 = []
        this.到货重量组 = []
        this.到货金额组 = []
        this.arrest.map(v => {
          this.工艺计划流水号组.push(v.工艺计划流水号)
          this.采购计划明细流水号组.push(v.采购计划明细流水号)
          this.离线采购计划明细流水号组.push(v.离线采购计划明细流水号)
          this.本次到货数量组.push(v.未到货数量)
          this.到货重量组.push(v.到货重量)
          this.到货金额组.push(v.到货重量 * this.单价)
        })
        addMateriel(this.ArrivalOrderMXNumber, this.工艺计划流水号组, this.采购计划明细流水号组, this.本次到货数量组, this.离线采购计划明细流水号组, this.到货重量组, this.到货金额组, this.userId).then(response => {
          if (response.data[0].result === '1') {
            this.$message.success('关联成功')
            this.tableData30 = []
            this.searchTable20()
            searchTable6(this.ArrivalOrderMXNumber).then(response => {
              this.tableData6 = response.data
              if (response.data.length !== 0) {
                this.未绑定数量 = response.data[0].未绑定数量
              }
            })
          } else { this.$message.error('关联失败') }
        })
      }
    },
    deleteMateriel(row) {
      this.$confirm('确定取消关联?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        deleteMateriel(row.到货单明细绑定流水号, row.采购计划明细流水号, row.离线采购计划明细流水号).then(response => {
          if (response.data[0].result === '1') {
            this.$message.success('取消成功')
            searchTable6(this.ArrivalOrderMXNumber).then(response => {
              this.tableData6 = response.data
              if (response.data.length !== 0) {
                this.未绑定数量 = response.data[0].未绑定数量
              }
            })
          } else { this.$message.error('取消失败') }
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消操作'
        })
      })
    }
  }
}
</script>

<style scoped>
  .el-table__footer-wrapper tbody td, .el-table__header-wrapper tbody td {
    /* background-color: #7eaced; */
    font-weight: bold;
    color: black;
  }
  .offlineContract td{
    height: 40px;
    text-align: center;
  }
  /*.el-card{*/
  /*  margin-bottom: 15px;*/
  /*}*/
  .el-date-editor{
    width:150px;
  }
  .el-select{
    width:200px
  }
  .el-input{
    width:200px
  }
  span{
    /*margin: 10px 0 10px 0px;*/
  }
  .el-tag{
    margin: 0
  }
  .searchForm .el-form-item{
    margin-bottom: 5px;
  }
  .edit-input {
    padding-right: 100px;
  }
  .cancel-btn {
    position: absolute;
    right: 15px;
    top: 5px;
  }
</style>
<style>
  .el-table__footer-wrapper tbody td, .el-table__header-wrapper tbody td {
    background-color: #F5F7FA;
    font-weight: bold;
    color: black;
  }
</style>
