<template>
  <div class="app-container">
    <el-card>
      <div v-if="Number(token)===2" style="width:100%">
        <el-divider content-position="right">
          <el-button type="text" @click="searchUnallocatePartNumber">刷新</el-button> | 待分配零件数
        </el-divider>
        <el-row>
          <el-col v-for="(machine,index) in machines" :key="index" style="width: 200px">
            <el-card shadow="hover" class="sudoku_item" style="height:80px;width: 90%" @click.native="clickCard(machine.项目流水号, machine.机床流水号)">
              <el-badge :value="machine.未分配零件数">
                <div style="width: 100px;height:50px;margin:0" class="sudoku_item">
                  {{ machine.机床图号 }}
                </div>
              </el-badge>
            </el-card>
          </el-col>
        </el-row>
        <el-divider content-position="right"/>
      </div>
    </el-card>
    <el-tabs v-model="tabName" type="border-card" @tab-click="searchTable0();searchTable1();searchTable2();">
      <el-tab-pane label="标准件" name="标准件">
        <el-row style="margin-bottom: 5px">
          <span style="margin-left: 0">项目名称:</span>
          <el-select v-model="projectValue" placeholder="项目名称" size="small" filterable clearable @change="projectChange">
            <el-option
              v-for="item in project"
              :key="item.value"
              :label="item.label"
              :value="item.value"/>
          </el-select>
          <span>机床图号:</span>
          <el-select v-model="machineValue" placeholder="机床图号" size="small" filterable clearable @change="machineChange">
            <el-option
              v-for="item in machine"
              :key="item.value"
              :label="item.label"
              :value="item.value">
              <b style="float: left">{{ item.label }}</b>
              <b style="float: right; color: #8492a6; font-size: 13px">{{ item.name }}</b>
            </el-option>
          </el-select>
          <el-button
            type="success"
            size="small"
            icon="el-icon-search"
            style="margin-left: 10px;"
            @click="pageCurrent0=1;pageSize0=20;total0=0;searchTable0()">查询</el-button>
          <div style="float:right;">
            <span style="margin-left: 0">采购员:</span>
            <el-select v-model="personValue" placeholder="采购员" size="small" style="width: 100px">
              <el-option
                v-for="item in person"
                :key="item.value"
                :label="item.label"
                :value="item.value"/>
            </el-select>
          </div>
        </el-row>
        <el-row style="margin-bottom: 5px">
          <span style="margin-left: 0">组&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;号:</span>
          <el-select v-model="groupValue" placeholder="组号" size="small" filterable clearable>
            <el-option
              v-for="item in group"
              :key="item.value"
              :label="item.label"
              :value="item.value"/>
          </el-select>
          <span style="margin-right: -10px">物料状态:</span>
          <el-cascader :options="materialStatus" :props="{ checkStrictly: true }" v-model="materialStatusValue" size="small" style="margin-left: 10px"/>
          <div style="float:right;padding-top:10px;">
            <el-button
              type="primary"
              size="small"
              icon="el-icon-menu"
              style="margin-left: 10px"
              @click="allocateTask1">分配</el-button>
            <el-button
              type="danger"
              size="small"
              icon="el-icon-back"
              style="margin-left: 10px"
              @click="executeReturn1">退回</el-button>
          </div>
        </el-row>
        <el-row style="margin-bottom: 15px">
          <span style="margin-left: 0">物料类别:</span>
          <el-select
            v-model="MaterialCategoryValue"
            placeholder="请选择"
            size="small"
            clearable
            @change="searchMaterialVariety">
            <el-option
              v-for="item in MaterialCategory"
              :key="item.value"
              :label="item.label"
              :value="item.value"/>
          </el-select>
          <span>物料品种:</span>
          <el-select
            v-model="MaterialVarietyValue"
            placeholder="请选择"
            size="small"
            clearable>
            <el-option
              v-for="item in MaterialVariety"
              :key="item.value"
              :label="item.label"
              :value="item.value"/>
          </el-select>
        </el-row>
        <el-row style="margin-bottom: 15px">
          <span style="margin-left: 0">物料名称:</span>
          <el-input v-model="materialName" placeholder="物料名称" size="small" clearable/>
          <span>物料规格:</span>
          <el-input v-model="materialSpec" placeholder="物料规格" size="small" clearable/>
          <span>物料型号:</span>
          <el-input v-model="materialModel" placeholder="物料型号" size="small" clearable/>
        </el-row>
        <el-row style="margin-bottom: 10px">
          <el-table v-loading="" :data="tableData0" size="mini" style="max-height: 600px" height="500px" border stripe @selection-change="handleSelectionChange1">
            <el-table-column :selectable="selectable" align="center" type="selection"/>
            <el-table-column align="center" label="采购情况" min-width="80px">
              <template slot-scope="scope">
                <el-tag v-if="scope.row.人员编号===''" type="primary" size="small">未分配</el-tag>
                <el-tag v-if="parseInt(scope.row.询价状态编号)===1&&scope.row.人员编号!==''" type="warning" size="small">未询价</el-tag>
                <el-tag v-if="parseInt(scope.row.询价状态编号)===3&&parseInt(scope.row.采购状态编号)!==3" type="success" size="small">已询价</el-tag>
                <el-tag v-if="parseInt(scope.row.采购状态编号)===3" type="info" size="small">已采购</el-tag>
              </template>
            </el-table-column>
            <el-table-column align="center" label="项目名称" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.项目名称 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="机床图号" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.机床图号 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="组号" min-width="80px">
              <template slot-scope="scope">
                {{ scope.row.组号 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="物料类别" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.物料类别 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="物料品种" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.物料品种 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="图号或型号" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.物料型号 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="名称" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.物料名称 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="规格" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.物料规格 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="数量" min-width="80px">
              <template slot-scope="scope">
                {{ scope.row.零件数量 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="备注" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.备注 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="供货商" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.供货商 }}
              </template>
            </el-table-column>
            <!--<el-table-column :filters="source" :filter-method="filterSource" align="center" label="数据来源" min-width="90px" prop="零件类型">-->
            <!--<template slot-scope="scope">-->
            <!--{{ Number(scope.row.零件类型) === 1 ? 'BZ' : 'WG' }}-->
            <!--</template>-->
            <!--</el-table-column>-->
            <el-table-column align="center" label="计划到货时间" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.物料计划到货时间.split(' ')[0] }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="生产分配时间" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.操作日期.split(' ')[0] }}
              </template>
            </el-table-column>
            <el-table-column :filters="person" :filter-method="filterHandler" align="center" label="采购员" min-width="80px" prop="姓名">
              <template slot-scope="scope">
                {{ scope.row.姓名 ? scope.row.姓名 : '—' }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="采购分配时间" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.任务分配时间 ? scope.row.任务分配时间.split(' ')[0] : '—' }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="撤回分配" min-width="100px" fixed="right">
              <template slot-scope="scope">
                <el-button
                  :disabled="!(parseInt(scope.row.询价状态编号)===1&&scope.row.人员编号!=='')"
                  type="primary"
                  size="mini"
                  icon="el-icon-back"
                  @click="retract(scope.row)">撤回</el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-row>
        <div class="block">
          <el-pagination
            :current-page="pageCurrent0"
            :page-sizes="[10, 20, 30, 40]"
            :page-size="pageSize0"
            :total="total0"
            style="display:inline-block;width:50%"
            layout="total, sizes, prev, pager, next, jumper"
            @size-change="handleSizeChange0"
            @current-change="handleCurrentChange0"/>
        </div>
      </el-tab-pane>
      <el-tab-pane label="外购件" name="外购件">
        <el-row style="margin-bottom: 5px">
          <span style="margin-left: 0">项目名称:</span>
          <el-select v-model="projectValue" placeholder="项目名称" size="small" filterable clearable @change="projectChange">
            <el-option
              v-for="item in project"
              :key="item.value"
              :label="item.label"
              :value="item.value"/>
          </el-select>
          <span>机床图号:</span>
          <el-select v-model="machineValue" placeholder="机床图号" size="small" filterable clearable @change="machineChange">
            <el-option
              v-for="item in machine"
              :key="item.value"
              :label="item.label"
              :value="item.value">
              <b style="float: left">{{ item.label }}</b>
              <b style="float: right; color: #8492a6; font-size: 13px">{{ item.name }}</b>
            </el-option>
          </el-select>
          <el-button
            type="success"
            size="small"
            icon="el-icon-search"
            style="margin-left: 10px;"
            @click="pageCurrent1=1;pageSize1=20;total1=0;searchTable1()">查询</el-button>
          <div style="float:right;">
            <span style="margin-left: 0">采购员:</span>
            <el-select v-model="personValue" placeholder="采购员" size="small" style="width: 100px">
              <el-option
                v-for="item in person"
                :key="item.value"
                :label="item.label"
                :value="item.value"/>
            </el-select>
          </div>
        </el-row>
        <el-row style="margin-bottom: 5px">
          <span style="margin-left: 0">组&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;号:</span>
          <el-select v-model="groupValue" placeholder="组号" size="small" filterable clearable>
            <el-option
              v-for="item in group"
              :key="item.value"
              :label="item.label"
              :value="item.value"/>
          </el-select>
          <span style="margin-right: -10px">物料状态:</span>
          <el-cascader :options="materialStatus" :props="{ checkStrictly: true }" v-model="materialStatusValue" size="small" style="margin-left: 10px"/>
          <div style="float:right;padding-top:10px;">
            <el-button
              type="primary"
              size="small"
              icon="el-icon-menu"
              style="margin-left: 10px"
              @click="allocateTask1">分配</el-button>
            <el-button
              type="danger"
              size="small"
              icon="el-icon-back"
              style="margin-left: 10px"
              @click="executeReturn1">退回</el-button>
          </div>
        </el-row>
        <el-row style="margin-bottom: 15px">
          <span style="margin-left: 0">物料类别:</span>
          <el-select
            v-model="MaterialCategoryValue"
            placeholder="请选择"
            size="small"
            clearable
            @change="searchMaterialVariety">
            <el-option
              v-for="item in MaterialCategory"
              :key="item.value"
              :label="item.label"
              :value="item.value"/>
          </el-select>
          <span>物料品种:</span>
          <el-select
            v-model="MaterialVarietyValue"
            placeholder="请选择"
            size="small"
            clearable>
            <el-option
              v-for="item in MaterialVariety"
              :key="item.value"
              :label="item.label"
              :value="item.value"/>
          </el-select>
        </el-row>
        <el-row style="margin-bottom: 15px">
          <span style="margin-left: 0">物料名称:</span>
          <el-input v-model="materialName" placeholder="物料名称" size="small" clearable/>
          <span>物料规格:</span>
          <el-input v-model="materialSpec" placeholder="物料规格" size="small" clearable/>
          <span>物料型号:</span>
          <el-input v-model="materialModel" placeholder="物料型号" size="small" clearable/>
        </el-row>
        <el-row style="margin-bottom: 10px">
          <el-table v-loading="" :data="tableData1" size="mini" style="max-height: 600px" height="500px" border stripe @selection-change="handleSelectionChange1">
            <el-table-column :selectable="selectable" align="center" type="selection"/>
            <el-table-column align="center" label="采购情况" min-width="80px">
              <template slot-scope="scope">
                <el-tag v-if="scope.row.人员编号===''" type="primary" size="small">未分配</el-tag>
                <el-tag v-if="parseInt(scope.row.询价状态编号)===1&&scope.row.人员编号!==''" type="warning" size="small">未询价</el-tag>
                <el-tag v-if="parseInt(scope.row.询价状态编号)===3&&parseInt(scope.row.采购状态编号)!==3" type="success" size="small">已询价</el-tag>
                <el-tag v-if="parseInt(scope.row.采购状态编号)===3" type="info" size="small">已采购</el-tag>
              </template>
            </el-table-column>
            <el-table-column align="center" label="项目名称" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.项目名称 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="机床图号" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.机床图号 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="组号" min-width="80px">
              <template slot-scope="scope">
                {{ scope.row.组号 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="物料类别" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.物料类别 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="物料品种" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.物料品种 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="图号或型号" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.物料型号 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="名称" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.物料名称 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="规格" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.物料规格 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="数量" min-width="80px">
              <template slot-scope="scope">
                {{ scope.row.零件数量 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="备注" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.备注 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="供货商" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.供货商 }}
              </template>
            </el-table-column>
            <!--<el-table-column :filters="source" :filter-method="filterSource" align="center" label="数据来源" min-width="90px" prop="零件类型">-->
            <!--<template slot-scope="scope">-->
            <!--{{ Number(scope.row.零件类型) === 1 ? 'BZ' : 'WG' }}-->
            <!--</template>-->
            <!--</el-table-column>-->
            <el-table-column align="center" label="计划到货时间" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.物料计划到货时间.split(' ')[0] }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="生产分配时间" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.操作日期.split(' ')[0] }}
              </template>
            </el-table-column>
            <el-table-column :filters="person" :filter-method="filterHandler" align="center" label="采购员" min-width="80px" prop="姓名">
              <template slot-scope="scope">
                {{ scope.row.姓名 ? scope.row.姓名 : '—' }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="采购分配时间" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.任务分配时间 ? scope.row.任务分配时间.split(' ')[0] : '—' }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="撤回分配" min-width="100px" fixed="right">
              <template slot-scope="scope">
                <el-button
                  :disabled="!(parseInt(scope.row.询价状态编号)===1&&scope.row.人员编号!=='')"
                  type="primary"
                  size="mini"
                  icon="el-icon-back"
                  @click="retract(scope.row)">撤回</el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-row>
        <div class="block">
          <el-pagination
            :current-page="pageCurrent1"
            :page-sizes="[10, 20, 30, 40]"
            :page-size="pageSize1"
            :total="total1"
            style="display:inline-block;width:50%"
            layout="total, sizes, prev, pager, next, jumper"
            @size-change="handleSizeChange1"
            @current-change="handleCurrentChange1"/>
        </div>
      </el-tab-pane>
      <el-tab-pane label="基本件" name="基本件">
        <el-row style="margin-bottom: 5px">
          <span style="margin-left: 0">项目名称:</span>
          <el-select v-model="projectValue" placeholder="项目名称" size="small" filterable clearable @change="projectChange">
            <el-option
              v-for="item in project"
              :key="item.value"
              :label="item.label"
              :value="item.value"/>
          </el-select>
          <span>机床图号:</span>
          <el-select v-model="machineValue" placeholder="机床图号" size="small" filterable clearable @change="machineChange">
            <el-option
              v-for="item in machine"
              :key="item.value"
              :label="item.label"
              :value="item.value">
              <b style="float: left">{{ item.label }}</b>
              <b style="float: right; color: #8492a6; font-size: 13px">{{ item.name }}</b>
            </el-option>
          </el-select>
          <el-button
            type="success"
            size="small"
            icon="el-icon-search"
            style="margin-left: 10px;"
            @click="pageCurrent2=1;pageSize2=20;total2=0;searchTable2()">查询</el-button>
          <div style="float:right">
            <span style="margin-left: 0">采购员:</span>
            <el-select v-model="personValue" placeholder="采购员" size="small" style="width: 100px">
              <el-option
                v-for="item in person"
                :key="item.value"
                :label="item.label"
                :value="item.value"/>
            </el-select>
          </div>
        </el-row>
        <el-row style="margin-bottom: 5px">
          <span style="margin-left: 0">组&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;号:</span>
          <el-select v-model="groupValue" placeholder="组号" size="small" filterable clearable>
            <el-option
              v-for="item in group"
              :key="item.value"
              :label="item.label"
              :value="item.value"/>
          </el-select>
          <span style="margin-right: -10px">物料状态:</span>
          <el-cascader :options="materialStatus" :props="{ checkStrictly: true }" v-model="materialStatusValue" size="small" style="margin-left: 10px"/>
          <div style="float:right;padding-top: 10px">
            <el-button
              type="primary"
              size="small"
              icon="el-icon-menu"
              style="margin-left: 10px"
              @click="allocateTask2">分配</el-button>
            <el-button
              type="danger"
              size="small"
              icon="el-icon-back"
              style="margin-left: 10px"
              @click="executeReturn2">退回</el-button>
          </div>
        </el-row>
        <el-row style="margin-bottom: 15px">
          <span style="margin-left: 0">零件图号:</span>
          <el-input v-model="partNum" placeholder="零件图号" size="small" clearable/>
          <span>零件名称:</span>
          <el-input v-model="partName" placeholder="零件名称" size="small" clearable/>
        </el-row>
        <el-row style="margin-bottom: 15px">
          <span style="margin-left: 0">零件规格:</span>
          <el-input v-model="partSpec" placeholder="零件规格" size="small" clearable/>
          <span>零件材料:</span>
          <el-input v-model="partMaterial" placeholder="零件材料" size="small" clearable/>
        </el-row>
        <el-row style="margin-bottom: 10px">
          <el-table v-loading="" :data="tableData2" size="mini" style="max-height: 600px" height="500px" border stripe @selection-change="handleSelectionChange2">
            <el-table-column :selectable="selectable" align="center" type="selection"/>
            <el-table-column align="center" label="采购情况" min-width="80px">
              <template slot-scope="scope">
                <el-tag v-if="scope.row.人员编号===''" type="primary" size="small">未分配</el-tag>
                <el-tag v-if="parseInt(scope.row.询价状态编号)===1&&scope.row.人员编号!==''" type="warning" size="small">未询价</el-tag>
                <el-tag v-if="parseInt(scope.row.询价状态编号)===3&&parseInt(scope.row.采购状态编号)!==3" type="success" size="small">已询价</el-tag>
                <el-tag v-if="parseInt(scope.row.采购状态编号)===3" type="info" size="small">已采购</el-tag>
              </template>
            </el-table-column>
            <el-table-column align="center" label="项目名称" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.项目名称 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="机床图号" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.机床图号 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="组号" min-width="80px">
              <template slot-scope="scope">
                {{ scope.row.组号 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="图号" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.零件图号 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="名称" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.零件名称 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="规格" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.规格 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="材料" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.材料 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="数量" min-width="80px">
              <template slot-scope="scope">
                {{ scope.row.零件数量 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="备注" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.备注 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="供货商" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.供货商 }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="计划到货时间" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.物料计划到货时间.split(' ')[0] }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="生产分配时间" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.操作日期.split(' ')[0] }}
              </template>
            </el-table-column>
            <el-table-column :filters="person" :filter-method="filterHandler" align="center" label="采购员" min-width="80px" prop="buyer">
              <template slot-scope="scope">
                {{ scope.row.姓名 ? scope.row.姓名 : '—' }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="采购分配时间" min-width="100px">
              <template slot-scope="scope">
                {{ scope.row.任务分配时间 ? scope.row.任务分配时间.split(' ')[0] : '—' }}
              </template>
            </el-table-column>
            <el-table-column align="center" label="撤回分配" min-width="100px" fixed="right">
              <template slot-scope="scope">
                <el-button
                  :disabled="!(parseInt(scope.row.询价状态编号)===1&&scope.row.人员编号!=='')"
                  type="primary"
                  size="mini"
                  icon="el-icon-back"
                  @click="retract(scope.row)">撤回</el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-row>
        <div class="block">
          <el-pagination
            :current-page="pageCurrent2"
            :page-sizes="[10, 20, 30, 40]"
            :page-size="pageSize2"
            :total="total2"
            style="display:inline-block;width:50%"
            layout="total, sizes, prev, pager, next, jumper"
            @size-change="handleSizeChange2"
            @current-change="handleCurrentChange2"/>
        </div>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import { initMaterialCategory, initMaterialVariety, initProject, initBuyer, searchMachine, searchGroup, searchTable1, searchTable2, allocateTask1,
  allocateTask2, executeReturn1, executeReturn2, retract1, retract2 } from '@/api/PurchasingCenter/PurchaseTaskAllocate'
import { mapGetters } from 'vuex'
import request from '@/utils/request'

export default {
  name: '', // 采购任务分配
  data() {
    return {
      timer2: '',
      machines: [],
      source: [
        {
          text: 'BZ',
          value: 1
        },
        {
          text: 'WG',
          value: 2
        }
      ],
      tabName: '标准件',
      partNum: '',
      partName: '',
      partSpec: '',
      partMaterial: '',
      materialSpec: '',
      materialModel: '',
      MaterialCategoryValue: '', // 物料类别
      MaterialCategory: [], // 物料类别数组
      MaterialVarietyValue: '', // 物料品种
      MaterialVariety: [], // 物料品种数组
      projectValue: '',
      project: [],
      machineValue: '',
      machine: [],
      groupValue: '',
      group: [],
      materialName: '',
      materialStatusValue: [0], // 物料状态
      materialStatus: [
        {
          value: 0,
          label: '全部'
        },
        {
          value: 1,
          label: '未分配'
        },
        {
          value: 2,
          label: '已分配',
          children: [{
            value: 3,
            label: '未询价'
          }, {
            value: 4,
            label: '已询价',
            children: [{
              value: 5,
              label: '未采购'
            }, {
              value: 6,
              label: '已采购'
            }]
          }]
        }
      ], // 物料状态
      personValue: '',
      person: [],
      check1: 0,
      check2: 0,
      check3: 0,
      check4: 0,
      tableData0: [],
      tableData1: [],
      tableData2: [],
      standardAndPurchase: [],
      basic: [],
      groupAndPart: [],
      groupAndPartBasic: [],
      pageCurrent0: 1,
      pageSize0: 20,
      total0: 0,
      pageCurrent1: 1,
      pageSize1: 20,
      total1: 0,
      pageCurrent2: 1,
      pageSize2: 20,
      total2: 0
    }
  },
  computed: {
    ...mapGetters([
      'name',
      'token',
      'id'
    ])
  },
  created() {
    this.searchTable0() // 查表1
    this.fetchData() // 初始化数据
    this.searchUnallocatePartNumber()
    this.timer2 = setInterval(this.searchUnallocatePartNumber, 20 * 60 * 1000) // 20 分钟一刷新
  },
  beforeDestroy() {
    clearInterval(this.timer2)
  },
  methods: {
    // 选择机床
    clickCard(project, machine) {
      this.projectValue = project
      this.machine = []
      this.machineValue = ''
      this.group = []
      this.groupValue = ''
      searchMachine(this.projectValue).then(response => {
        for (let i = 0; i < response.data.length; i++) {
          this.machine.push({
            value: response.data[i].机床流水号,
            label: response.data[i].机床图号,
            name: response.data[i].机床名称
          })
        }
        this.machineValue = machine
        this.materialStatusValue = [1]
        this.searchTable0()
        this.searchTable1()
        this.searchTable2()
      })
    },
    filterSource(value, row) {
      return Number(row['零件类型']) === Number(value)
    },
    // 撤回
    retract(row) {
      this.$confirm('是否撤回重新分配?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        if (this.tabName === '基本件') {
          retract2(row.基本件流水号).then(res => {
            if (Number(res.data[0].result) === 1) {
              this.$message.success('撤回成功')
              this.searchTable2()
            } else {
              this.$message.error('撤回失败')
            }
          })
        } else {
          retract1(row.标准件和外购件流水号).then(res => {
            if (Number(res.data[0].result) === 1) {
              this.$message.success('撤回成功')
              this.searchTable0()
              this.searchTable1()
            } else {
              this.$message.error('撤回失败')
            }
          })
        }
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消操作'
        })
      })
    },
    fetchData() { // 初始化
      initProject().then(response => {
        for (let i = 0; i < response.data.length; i++) {
          this.project.push({
            label: response.data[i].项目名称,
            value: response.data[i].项目流水号
          })
        }
      })
      initBuyer().then(response => {
        for (let i = 0; i < response.data.length; i++) {
          this.person.push({
            text: response.data[i].姓名,
            label: response.data[i].姓名,
            value: response.data[i].人员编号
          })
        }
      })
      this.getSelect(initMaterialCategory, ['物料类别', '物料类别流水号'], 'MaterialCategory', [0, this.DepartmentValue])
    },
    projectChange() {
      this.machine = []
      this.machineValue = ''
      this.group = []
      this.groupValue = ''
      searchMachine(this.projectValue).then(response => {
        for (let i = 0; i < response.data.length; i++) {
          this.machine.push({
            value: response.data[i].机床流水号,
            label: response.data[i].机床图号,
            name: response.data[i].机床名称
          })
        }
      })
    },
    machineChange() {
      this.group = []
      this.groupValue = ''
      searchGroup(this.machineValue).then(response => {
        for (let i = 0; i < response.data.length; i++) {
          this.group.push({
            value: response.data[i].组件流水号,
            label: response.data[i].组号
          })
        }
      })
    },
    searchMaterialVariety() { // 初始化物料品种
      this.MaterialVariety = []
      this.MaterialVarietyValue = ''
      this.getSelect(initMaterialVariety, ['物料品种', '物料品种流水号'], 'MaterialVariety', this.MaterialCategoryValue)
    },
    searchTable0() { // 查询标准件
      this.MaterialCategoryValue ? this.check1 = 1 : this.check1 = 0
      this.MaterialVarietyValue ? this.check2 = 1 : this.check2 = 0
      this.projectValue ? this.check3 = 1 : this.check3 = 0
      let check0, check1, check2, check3
      this.machineValue ? check0 = 1 : check0 = 0
      this.groupValue ? check1 = 1 : check1 = 0
      this.materialName ? this.check4 = 1 : this.check4 = 0
      this.materialSpec ? check2 = 1 : check2 = 0
      this.materialModel ? check3 = 1 : check3 = 0
      searchTable1(this.pageCurrent0, this.pageSize0, this.check1, this.MaterialCategoryValue, this.check2, this.MaterialVarietyValue, this.check3, this.projectValue, check0, this.machineValue, check1, this.groupValue, this.check4, this.materialName, this.materialStatusValue[this.materialStatusValue.length - 1], check2, this.materialSpec, check3, this.materialModel, 1).then(response => {
        this.tableData0 = response.data.rows
        this.total0 = response.data.total
      })
    },
    searchTable1() { // 查询外购件
      this.MaterialCategoryValue ? this.check1 = 1 : this.check1 = 0
      this.MaterialVarietyValue ? this.check2 = 1 : this.check2 = 0
      this.projectValue ? this.check3 = 1 : this.check3 = 0
      let check0, check1, check2, check3
      this.machineValue ? check0 = 1 : check0 = 0
      this.groupValue ? check1 = 1 : check1 = 0
      this.materialName ? this.check4 = 1 : this.check4 = 0
      this.materialSpec ? check2 = 1 : check2 = 0
      this.materialModel ? check3 = 1 : check3 = 0
      searchTable1(this.pageCurrent1, this.pageSize1, this.check1, this.MaterialCategoryValue, this.check2, this.MaterialVarietyValue, this.check3, this.projectValue, check0, this.machineValue, check1, this.groupValue, this.check4, this.materialName, this.materialStatusValue[this.materialStatusValue.length - 1], check2, this.materialSpec, check3, this.materialModel, 2).then(response => {
        this.tableData1 = response.data.rows
        this.total1 = response.data.total
      })
    },
    searchTable2() { // 查询基本件
      this.projectValue ? this.check3 = 1 : this.check3 = 0
      let check1, check2, check3, check4, check5, check6
      this.partNum ? check1 = 1 : check1 = 0
      this.partName ? check2 = 1 : check2 = 0
      this.partSpec ? check3 = 1 : check3 = 0
      this.partMaterial ? check4 = 1 : check4 = 0
      this.machineValue ? check5 = 1 : check5 = 0
      this.groupValue ? check6 = 1 : check6 = 0
      searchTable2(this.pageCurrent2, this.pageSize2, this.check3, this.projectValue, check5, this.machineValue, check6, this.groupValue, this.materialStatusValue[this.materialStatusValue.length - 1], check1, this.partNum, check2, this.partName, check3, this.partSpec, check4, this.partMaterial).then(response => {
        this.tableData2 = response.data.rows
        this.total2 = response.data.total
      })
    },
    handleSelectionChange1(val) { // 标准件和外购件多选
      this.standardAndPurchase = []
      this.groupAndPart = []
      for (let i = 0; i < val.length; i++) {
        this.standardAndPurchase.push(val[i].标准件和外购件流水号)
        this.groupAndPart.push(val[i].组件零件流水号)
      }
    },
    handleSelectionChange2(val) { // 基本件多选
      this.basic = []
      this.groupAndPartBasic = []
      for (let i = 0; i < val.length; i++) {
        this.basic.push(val[i].基本件流水号)
        this.groupAndPartBasic.push(val[i].组件零件基本件流水号)
      }
    },
    selectable(row) { // 多选禁用
      return row.人员编号 === '' || row.人员编号 === null
    },
    allocateTask1() { // 标准件和外购件分配任务
      if (!this.personValue) {
        this.$message.error('请选择采购员')
      } else if (this.standardAndPurchase.length === 0) {
        this.$message.error('请选择需分配的物料')
      } else {
        this.$confirm('此操作执行后不可修改，是否确定分配?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          allocateTask1(this.standardAndPurchase, this.personValue).then(response => {
            if (response.data[0].result === '1') {
              this.$message.success('操作成功')
              this.searchTable0()
              this.searchTable1()
            } else { this.$message.error('操作失败') }
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消操作'
          })
        })
      }
    },
    allocateTask2() { // 基本件分配任务
      if (!this.personValue) {
        this.$message.error('请选择采购员')
      } else if (this.basic.length === 0) {
        this.$message.error('请选择需分配的零件')
      } else {
        this.$confirm('此操作执行后不可修改，是否确定分配?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          allocateTask2(this.basic, this.personValue).then(response => {
            if (response.data[0].result === '1') {
              this.$message.success('操作成功')
              this.searchTable2()
            } else { this.$message.error('操作失败') }
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消操作'
          })
        })
      }
    },
    filterHandler(value, row) {
      return parseInt(row['人员编号']) === parseInt(value)
    },
    handleSizeChange0(val) {
      this.pageSize0 = val
      this.pageCurrent0 = 1
      this.searchTable0()
    },
    handleCurrentChange0(val) {
      this.pageCurrent0 = val
      this.searchTable0()
    },
    handleSizeChange1(val) {
      this.pageSize1 = val
      this.pageCurrent1 = 1
      this.searchTable1()
    },
    handleCurrentChange1(val) {
      this.pageCurrent1 = val
      this.searchTable1()
    },
    handleSizeChange2(val) {
      this.pageSize2 = val
      this.pageCurrent2 = 1
      this.searchTable2()
    },
    handleCurrentChange2(val) {
      this.pageCurrent2 = val
      this.searchTable2()
    },
    executeReturn1() { // 退回标准件和外购件
      if (this.standardAndPurchase.length === 0) {
        this.$message.error('请选择需退回的物料')
      } else {
        this.$confirm('此操作执行后不可修改，是否确定退回?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          executeReturn1(this.standardAndPurchase, this.groupAndPart).then(response => {
            if (response.data[0].result === '1') {
              this.$message.success('操作成功')
              this.searchTable0()
              this.searchTable1()
            } else { this.$message.error('操作失败') }
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消操作'
          })
        })
      }
    },
    executeReturn2() { // 退回基本件
      if (this.basic.length === 0) {
        this.$message.error('请选择需退回的零件')
      } else {
        this.$confirm('此操作执行后不可修改，是否确定退回?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          executeReturn2(this.basic, this.groupAndPartBasic).then(response => {
            if (response.data[0].result === '1') {
              this.$message.success('操作成功')
              this.searchTable2()
            } else { this.$message.error('操作失败') }
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消操作'
          })
        })
      }
    },
    async searchUnallocatePartNumber() {
      this.machines = []
      await request({
        url: '',
        method: 'post',
        data: {
          type: '3',
          name: ` select 项目流水号,机床流水号,机床图号,sum(未分配零件数) as 未分配零件数 from (
                  select 项目流水号,机床流水号,机床图号,COUNT(*) as 未分配零件数 from MRP_计划订单_组件零件清单_标准件和外购件_视图
                  where 人员编号 is null
                  group by 项目流水号,机床流水号,机床图号
                  union all
                  select 项目流水号,机床流水号,机床图号,COUNT(*) as 未分配零件数 from MRP_计划订单_组件零件清单_基本件_视图
                  where 人员编号 is null
                  group by 项目流水号,机床流水号,机床图号
                  ) as tb1
                  group by 项目流水号,机床流水号,机床图号`
        }
      }).then(res => {
        this.machines = res.data
      })
    }
  }
}
</script>

<style scoped>
  .el-tag{
    margin: 0
  }
  .el-card{
    margin-bottom: 15px;
  }
  .el-select{
    width:200px
  }
  .el-input{
    width:200px
  }
  span{
    margin: 10px 0 10px 10px;
  }
</style>
<style rel="stylesheet/scss" lang="scss" scoped>
  .item {
    margin-top: 10px;
    margin-right: 40px;
  }
  .sudoku_row{
    display: flex;
    align-items: center;
    width:100%;
    flex-wrap: wrap;
  }
  .sudoku_item{
    margin-bottom: 20px;
    margin-left: 20px;
    /*border: 1px solid red;*/
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width:15%;
    height: 200px;
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .opacity{
    opacity: 0.4;
    background: #e5e5e5;
  }
  .sudoku_item img{
    margin-bottom: 3px;
    display: block;
  }
  .dashboard {
    &-container {
      margin: 30px;
    }
    &-text {
      font-size: 30px;
      line-height: 46px;
    }
  }
</style>
