mec-cloud_-intelligent-manufacturing_client/zkqy-ui/src/views/orderMange/planTable/fankuang.vue

<template>
  <div class="app-container" style="width: 100%;">
        <!--表格-->
        <el-table
          :data="tableData"
          ref="tableRef">
          <el-table-column prop="machineId" fixed label="机台号" header-align="center" align="center" width="111px" ></el-table-column>
          <el-table-column prop="productionDigit" fixed label="生产位数" header-align="center" align="center" width="111.2px"></el-table-column>
          <el-table-column label="在机产品" header-align="center" >
            <el-table-column prop="currentColorCode" label="色号" header-align="center" width="90px" align="center"></el-table-column>
            <el-table-column prop="currentSpecification" label="规格" header-align="center" width="90px" align="center"></el-table-column>
            <el-table-column prop="currentLotNumber" label="批号" header-align="center"  width="90px" align="center"></el-table-column>
            <el-table-column prop="startTime" label="上机时间" header-align="center" width="90px" align="center"></el-table-column>
            <el-table-column prop="plannedEndTime" label="下机时间" header-align="center" width="90px" align="center"></el-table-column>
          </el-table-column>
          <el-table-column prop="plannedProduction" label="待生产产品列表" header-align="center" align="center"  >
            <template v-slot:default="scope">
              <div v-if="scope.row.plannedProduction && scope.row.plannedProduction.length > 0">
                <div v-for="(chunk, chunkIndex) in splitList(scope.row.plannedProduction, 5)" :key="`chunk-${chunkIndex}`">
                  <span v-for="(item, index) in chunk" :key="`item-${chunkIndex}-${index}`">
                    {{ item }}, <!-- 替换为实际显示每个产品的代码 -->
                  </span>
                </div>
              </div>
              <div v-else>

              </div>
            </template>
          </el-table-column>
          <el-table-column   fixed="right" label="操作" header-align="center" align="center" width="150px" >
            <template v-slot:default="scope">
              <el-dropdown>
                <el-button type="primary">
                  操作
                  <i class="el-icon-arrow-down el-icon--right"></i>
                </el-button>
                <el-dropdown-menu slot="dropdown">
                  <el-dropdown-item @click.native.prevent="handleAddPlan(scope.row)">新增计划</el-dropdown-item>
                  <el-dropdown-item @click.native.prevent="handleEditPlan(scope.row)">修改计划</el-dropdown-item>
                </el-dropdown-menu>
              </el-dropdown>
            </template>
          </el-table-column>
        </el-table>
        <!--新增计划弹窗-->
        <el-dialog title="新增计划"  :visible.sync="nanInsertDialogTableVisible" width="1200px">
          <el-table :data="tableData2" @row-click.self="handleRowClick">
<!--            <el-table-column prop="salesmanId" label="业务员" header-align="center" align="center" width="100px">-->
<!--              <template v-slot:default="scope">-->
<!--                <el-select  v-model="scope.row.salesmanId" placeholder="请选择业务员" @change="selectedSalesmanItem(scope.row,scope.row.salesmanId)">-->
<!--                  <el-option v-for="salesmanItem in salesmanInfo" :key="salesmanItem.saleNo" :label="salesmanItem.salesman" :value="salesmanItem.saleNo" ></el-option>-->
<!--                </el-select>-->
<!--              </template>-->
<!--            </el-table-column>-->
            <el-table-column prop="productId" label="产品" header-align="center" align="center" width="150px">
                <template v-slot:default="scope">
                     <el-select  v-model="scope.row.productId" placeholder="请选择待排产产品" @change="selectedChangeDate(scope.row,scope.row.productId)">
                           <el-option v-for="product in productsInfo" :key="product.id" :label="product.productName" :value="product.id" ></el-option>
                     </el-select>
                </template>
            </el-table-column>

            <el-table-column prop="currentColorCode" label="色号" header-align="center" align="center">
              <template v-slot:default="scope">
                <!-- 如果当前行正在编辑，则显示输入框 -->
                <el-input v-if="scope.row.isEditing"  disabled="disabled"  v-model="scope.row.currentColorCode" placeholder="请输入色号" @blur.stop.prevent="handleInputBlur(scope.row)" ></el-input>
                <!-- 否则显示普通文本 -->
                <span v-else>{{ scope.row.currentColorCode }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="productionDigit" label="生产位数" header-align="center" align="center">
              <template v-slot:default="scope">
                <el-input v-if="scope.row.isEditing" v-model="scope.row.productionDigit" placeholder="请输入生产位数" @blur.stop.prevent="handleInputBlur(scope.row)">></el-input>
                <span v-else>{{ scope.row.productionDigit }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="currentSpecification" label="规格" header-align="center" align="center">
              <template v-slot:default="scope">
                <!-- 如果当前行正在编辑，则显示输入框 -->
                <el-input v-if="scope.row.isEditing" disabled="disabled" v-model="scope.row.currentSpecification" placeholder="请输入规格" @blur.stop.prevent="handleInputBlur(scope.row)">></el-input>
                <!-- 否则显示普通文本 -->
                <span v-else>{{ scope.row.currentSpecification }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="currentLotNumber" label="批号" header-align="center" align="center">
              <template v-slot:default="scope">
                <el-input v-if="scope.row.isEditing" :disabled="isDisabled" v-model="scope.row.currentLotNumber" placeholder="请输入批号" @blur.stop.prevent="handleInputBlur(scope.row)">></el-input>
                <span v-else>{{ scope.row.currentLotNumber }}</span>
              </template>
            </el-table-column>

            <el-table-column prop="djNumber" label="数量" header-align="center" align="center">
              <template v-slot:default="scope">
                <el-input v-if="scope.row.isEditing" v-model="scope.row.number" placeholder="请输入数量" @blur.stop.prevent="handleInputBlur(scope.row)">></el-input>
                <span v-else>{{ scope.row.number }}</span>
              </template>
            </el-table-column>

            <el-table-column prop="startTime" label="上机时间" header-align="center" align="center">
              <template v-slot:default="scope">
                <el-input v-if="scope.row.isEditing" v-model="scope.row.startTime" placeholder="请输入上机时间" @blur.stop.prevent="handleInputBlur(scope.row)">></el-input>
                <span v-else>{{ scope.row.startTime }}</span>
              </template>
            </el-table-column>

            <el-table-column prop="plannedEndTime" label="计划下机时间" header-align="center" align="center">
              <template v-slot:default="scope">
                <el-input v-if="scope.row.isEditing" :ref="'input'+scope.$index" v-model="scope.row.plannedEndTime" placeholder="请输入计划下机时间" @blur="handleInputBlur(scope.row)">></el-input>
                <span v-else>{{ scope.row.plannedEndTime }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="planStatus" label="计划状态" header-align="center" align="center" width="100px">
              <template v-slot:default="scope">
                <el-select  v-model="scope.row.planStatus" placeholder="请选择计划状态">
                  <el-option v-for="stateItem in stateList0" :key="stateItem.id" :label="stateItem.name" :value="stateItem.id" ></el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column label="操作" align="center">
              <template slot-scope="scope">
                <el-button
                  size="mini"
                  type="danger"
                  @click.stop.prevent="handleDelete(scope.$index, scope.row)">删除</el-button>
              </template>
            </el-table-column>
          </el-table>
          <el-button type="primary" style="width: 100%;margin-top: 30px"  @click="addEditableRow">新增计划产品</el-button>
          <span slot="footer" class="dialog-footer">
            <el-button @click="nanInsertDialogTableVisible = false">取 消</el-button>
            <el-button type="primary" @click="addPlanInfo">确 定</el-button>
           </span>
        </el-dialog>
        <!--修改计划弹窗-->
        <el-dialog title="修改计划"  :visible.sync="nanUpdateDialogTableVisible" width="1200px">
           <!--查询条件-->
          <el-form ref="form"  :model="formData" label-width="80px" :inline="true">
              <el-form-item label="计划状态:">
                <el-select v-model="formData.planStatus" placeholder="请选择计划状态">
                  <el-option v-for="stateListItem in stateList2" :key="product.id" :label="stateListItem.name" :value="stateListItem.id" ></el-option>
                </el-select>
              </el-form-item>
              <el-form-item>
                <el-button type="primary" @click="onSubmit">查询</el-button>
                <el-button @click="reset">重置</el-button>
              </el-form-item>
          </el-form>
          <!--表格-->
          <el-table :data="tableData2" @row-click.self="handleRowClick">
<!--            <el-table-column prop="salesmanId" label="业务员" header-align="center" align="center" width="100px">-->
<!--              <template v-slot:default="scope">-->
<!--                <el-select  :ref="'salesmanSelect'+scope.$index"  v-model="scope.row.salesmanId" placeholder="请选择业务员" @change="selectedSalesmanItem(scope.row,scope.row.salesmanId,scope.$index)">-->
<!--                  <el-option v-for="salesmanItem in salesmanInfo" :key="salesmanItem.saleNo" :label="salesmanItem.salesman" :value="salesmanItem.saleNo" ></el-option>-->
<!--                </el-select>-->
<!--              </template>-->
<!--            </el-table-column>-->
            <el-table-column prop="productId" label="产品" header-align="center" align="center" width="150px">
              <template v-slot:default="scope">
                <el-select  :ref="'productSelected'+scope.$index" v-model="scope.row.productId" placeholder="请选择待排产产品" @change="selectedChangeDate(scope.row,scope.row.productId)">
                  <el-option v-for="product in productsInfo" :key="product.id" :label="product.productName" :value="product.id" ></el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column prop="productionDigit" label="生产位数" header-align="center" align="center">
              <template v-slot:default="scope">
                <el-input v-if="scope.row.isEditing" v-model="scope.row.productionDigit" placeholder="请输入生产位数" @blur.stop.prevent="handleInputBlur(scope.row)">></el-input>
                <span v-else>{{ scope.row.productionDigit }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="currentColorCode" label="色号" header-align="center" align="center">
              <template v-slot:default="scope">
                <!-- 如果当前行正在编辑，则显示输入框 -->
                <el-input v-if="scope.row.isEditing"  disabled="disabled"  v-model="scope.row.currentColorCode" placeholder="请输入色号" @blur.stop.prevent="handleInputBlur(scope.row)" ></el-input>
                <!-- 否则显示普通文本 -->
                <span v-else>{{ scope.row.currentColorCode }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="weishu" label="位数" header-align="center" align="center">
              <template v-slot:default="scope">
                <!-- 如果当前行正在编辑，则显示输入框 -->
                <el-input v-if="scope.row.isEditing"   v-model="scope.row.currentColorCode" placeholder="请输入色号" @blur.stop.prevent="handleInputBlur(scope.row)" ></el-input>
                <!-- 否则显示普通文本 -->
                <span v-else>{{ scope.row.currentColorCode }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="currentSpecification"  label="规格" header-align="center" align="center">
              <template v-slot:default="scope">
                <!-- 如果当前行正在编辑，则显示输入框 -->
                <el-input v-if="scope.row.isEditing"  disabled="disabled" v-model="scope.row.currentSpecification" placeholder="请输入规格" @blur.stop.prevent="handleInputBlur(scope.row)">></el-input>
                <!-- 否则显示普通文本 -->
                <span v-else>{{ scope.row.currentSpecification }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="currentLotNumber" label="批号" header-align="center" align="center">
              <template v-slot:default="scope">
                <el-input v-if="scope.row.isEditing" v-model="scope.row.currentLotNumber" placeholder="请输入批号" @blur.stop.prevent="handleInputBlur(scope.row)">></el-input>
                <span v-else>{{ scope.row.currentLotNumber }}</span>
              </template>
            </el-table-column>

            <el-table-column prop="startTime" label="上机时间" header-align="center" align="center">
              <template v-slot:default="scope">
                <el-input v-if="scope.row.isEditing" v-model="scope.row.startTime" placeholder="请输入上机时间" @blur.stop.prevent="handleInputBlur(scope.row)">></el-input>
                <span v-else>{{ scope.row.startTime }}</span>
              </template>
            </el-table-column>

            <el-table-column prop="plannedEndTime" label="计划下机时间" header-align="center" align="center">
              <template v-slot:default="scope">
                <el-input v-if="scope.row.isEditing" :ref="'input'+scope.$index" v-model="scope.row.plannedEndTime" placeholder="请输入计划下机时间" @blur="handleInputBlur(scope.row)">></el-input>
                <span v-else>{{ scope.row.plannedEndTime }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="planStatus" label="计划状态" header-align="center" align="center" width="100px">
              <template v-slot:default="scope">
                <!--上机变停机待机-->
                <el-select v-if="scope.row.planStatus==1" v-model="scope.row.planStatus" placeholder="计划状态" @change="selectedSalesmanItem(scope.row,scope.row.planStatus)">
                  <el-option v-for="stateItem in stateList1" :key="stateItem.id" :label="stateItem.name" :value="stateItem.id" ></el-option>
                </el-select>
                <!--待机可以上机-->
                <el-select v-if="scope.row.planStatus==0" v-model="scope.row.planStatus" placeholder="计划状态" @change="selectedSalesmanItem(scope.row,scope.row.planStatus)">
                  <el-option v-for="stateItem in stateList0" :key="stateItem.id" :label="stateItem.name" :value="stateItem.id" ></el-option>
                </el-select>
                <!--停机变上机-->
                <el-select v-if="scope.row.planStatus==2" v-model="scope.row.planStatus" placeholder="计划状态" @change="selectedSalesmanItem(scope.row,scope.row.planStatus)">
                  <el-option v-for="stateItem in stateList2" :key="stateItem.id" :label="stateItem.name" :value="stateItem.id" ></el-option>
                </el-select>
                <!--已完成-->
                <el-select v-if="scope.row.planStatus==3" v-model="scope.row.planStatus" placeholder="计划状态" @change="selectedSalesmanItem(scope.row,scope.row.planStatus)">
                  <el-option v-for="stateItem in stateList3" :key="stateItem.id" :label="stateItem.name" :value="stateItem.id" ></el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column label="操作" align="center" width="200px">
              <template v-slot:default="scope">
                <el-button
                  size="mini"
                  type="danger"
                  @click.stop.prevent="updateStatus(scope.$index, scope.row,scope.row.planStatus)">更新状态</el-button>
                <el-button
                  size="mini"
                  type="danger"
                  @click.stop.prevent="deletePlan(scope.$index, scope.row)">删除</el-button>
              </template>
            </el-table-column>
          </el-table>
          <span slot="footer" class="dialog-footer">
            <el-button @click="nanUpdateDialogTableVisible = false">取 消</el-button>
            <el-button type="primary" @click="nanUpdateDialogTableVisible = false">确 定</el-button>
           </span>
        </el-dialog>
  </div>
</template>
<script>
import {
  getProductsInfo,
  getMaterielInfo,
  getSalesman,
  getSpinningPlanList,
  addSpinningPlanList,
  getPlanSpinningInfo,
  updateSpinningInfoPlanOne, spinningFrameWinding
} from "@/api/plan/paln.js";
export default {
  data() {
    return {
      //
      isDisabled:true,
      //选中的是那个车间
      tableData:[],
      form: {
        product:"",
      },
      previousMachineId: undefined,
      currentRowspan: 1,
      prevRow: {},
      tableData2: [],
      tableDataStatus: [],
      nanInsertDialogTableVisible:false,
      nanUpdateDialogTableVisible:false,
      beiInsertDialogTableVisible:false,
      beiUpdateDialogTableVisible:false,
      editingRowIndex: -1,
      lastEditLine:0,
      isEditLine:false,
      productsInfo:[],
      salesmanInfo:[],
      product:{},
      materiel:{},
      //机台号
      machineId:"",
      // 待机/上机/停产
      stateList0:[
        {"id":0,"name":"待机"},
        {"id":1,"name":"上机"},
      ],
      stateList1:[
        {"id":0,"name":"待机"},
        {"id":1,"name":"上机"},
        {"id":2,"name":"停机"},
        {"id":3,"name":"已完成"},
      ],
      stateList2:[
        {"id":0,"name":"待机"},
        {"id":2,"name":"停机"},
        {"id":1,"name":"上机"},
      ],
      stateList3:[
        {"id":3,"name":"已完成"},
      ],
      formData:{
        updateSelectedProductCategory:"",
        updateSelectedProductState:""
      },
    }
  },
  mounted() {
    // 得到排产计划信息
    this.getSpinningPlanList();
    // this.getSalesman();
    this.getProductsInfo();
  },
  methods: {
    deletePlan($index,row){
      console.log(row)
      spinningFrameWinding(row.id).then(res=>{
        if(res.code==200){
          this.$message({
            message: '删除成功',
            type: 'success'
          });
        }else{
          this.$message({message:"删除失败",type: 'error'})
        }
        this.onSubmit();
        this.getSpinningPlanList();
      })
    },
    //五个显示为一排
    splitList(list, chunkSize) {
      const chunks = [];
      for (let i = 0; i < list.length; i += chunkSize) {
        chunks.push(list.slice(i, i + chunkSize));
      }
      return chunks;
    },
    // 查询排产信息
    getSpinningPlanList() {
      getSpinningPlanList({"productionLineDepartment":"翻框部"}).then((response) => {
        this.tableData = response.rows
      });
    },
    // //查询产品的业务员信息
    // getSalesman() {
    //   getSalesman().then((response) => {
    //     this.salesmanInfo = response.data;
    //   })
    // },
    // //业务员下拉框切换调用的函数
    // selectedSalesmanItem(row,saleNo,index){
    //   console.log("ccc",index)
    //   this.getProductsInfo(saleNo,index);
    // },
    // //待投产的产品数据
    // getProductsInfo(saleNo,sy) {
    //   getProductsInfo(saleNo,sy).then((response) => {
    //     this.productsInfo = response.data;
    //     this.productsInfo.forEach(item => {
    //       item.productName = item.productName+"—"+item.materieEncoding+item.materieColorNumber
    //     });
    //   })
    // },
    getProductsInfo() {
      console.log("ddddddddddddddddddddddd")
      getProductsInfo().then((response) => {
        this.productsInfo = response.data;
        this.productsInfo.forEach(item => {
          item.productName = item.productName+"—"+item.materieEncoding+item.materieColorNumber
        });
      })
    },
    // 下拉框数据改变查询色号批号信息
    selectedChangeDate(row,selectedProduct) {
      //选择的那个销售产品
      console.log(this.productsInfo,"hhhhhh")
      this.product = this.productsInfo.find(product => product.id === selectedProduct);
      //选择的那个产品
      this.form.product=selectedProduct;

      //通过母粒编码查询到对应的母粒信息
      let queryParams = {
        "materielCode": this.product.colourNumber
      }
      //得到对应的母粒信息
      getMaterielInfo(queryParams).then((response) => {
        if (response.data!=null) {
          this.materiel = response.data;
          //色号 母粒编码+色号
          row.currentColorCode = this.materiel.materieEncoding+"("+this.materiel.materieColorNumber+")";
        }
      });
      //isDisabled(有批号就用，没批号就自己输入)
      if(this.product.lotNumber!=undefined&&this.product.lotNumber!=""){
        row.currentLotNumber=this.product.lotNumber;
        this.isDisabled=true;
      }else {
        this.isDisabled=false;
      }
      //产品规格
      row.currentSpecification= this.product.productSpecifications;
      //合同号--销售单编号（以前打算存的是业务员信息后来存的是销售单编号）
      row.salesmanId=this.product.saleOrderNo;
    },
    // 新增计划产品信息
    handleAddPlan(row) {
      this.getProductsInfo();
      this.nanInsertDialogTableVisible = true
      this.tableData2=[]
      //先清空
      this.machineId=""
      //当前操作机台号
      this.machineId=row.machineId;
    },
    // 删除行
    handleDelete(index, row) {
      // console.log(index,row)
      // this.tableData2[a];
      this.tableData2.splice(index, 1);
      // 把上一编辑行置回-1
      this.editingRowIndex = -1;
    },
    // 点击编辑行
    handleRowClick(row) {
      this.isEditLine = true;
      //找到当前行的编辑索引
      var rowIndex = this.tableData2.indexOf(row);
      if (this.lastEditLine != 0 &&
        this.editingRowIndex !== rowIndex &&
        this.editingRowIndex !== -1 &&
        !this.isRowFilled(this.tableData2[this.lastEditLine])) {
        this.$message({
          message: '请先完成上一条数据的填写',
          type: 'warning'
        });
        return;
      }
      //编辑索引不等于当前编辑行索引
      if (this.editingRowIndex !== rowIndex) {
        // alert(this.editingRowIndex);
        if (this.editingRowIndex !== -1) {
          //把当前行变成不可编辑的
          this.tableData2[this.editingRowIndex].isEditing = false;
        }
        //把当前行变成可编辑的
        row.isEditing = true;
        this.editingRowIndex = rowIndex;
      }

    },
    // 光标失去焦点变成不可编辑
    handleInputBlur(row) {
      let rowIndex = this.tableData2.indexOf(row);
      //编辑索引不等于当前编辑行索引
      if (this.editingRowIndex !== rowIndex) {
        if (this.isRowFilled(row)) {
          row.isEditing = false;
          //对于整个表格来说
          this.isEditLine = false;
          //当前编辑行置为-1
          this.editingRowIndex = -1;
        }
      }
    },
    // 检查行是否填写完毕的示例方法
    isRowFilled(row) {
      return row.currentSpecification && row.productionDigit && row.startTime && row.plannedEndTime;
    },
    // 新增一行标记为可编辑
    addEditableRow() {
      // 检查当前编辑行是否已填写完毕
      if(this.tableData2.length!=0){
        if (this.editingRowIndex !== -1 && !this.isRowFilled(this.tableData2[this.editingRowIndex])) {
          this.$message({
            message: '请先完成上一条数据的填写',
            type: 'warning'
          });
          return;
        }
        //新增行之前先让以前的行不能编辑
        this.tableData2.forEach(item => {
          item.isEditing = false;
        })
      }
      this.tableData2.push({
        currentColorCode: '',
        currentSpecification: '',
        currentLotNumber: '',
        productionDigit: '',
        startTime: '',
        plannedEndTime:'',
        planStatus:0,
        productId:'',
        salesmanId:'',
        isEditing: true // 标记为正在编辑状态
      });
      this.editingRowIndex = this.tableData2.length - 1; // 更新当前编辑的行索引
      this.lastEditLine = this.tableData2.length - 1
    },
    // 添加计划
    addPlanInfo(){
      const datatime=Date.now()+this.machineId;
      //先查询计划表中有没有正在上机的
      getPlanSpinningInfo({"machineId":this.machineId,"planStatus":1}).then(response => {
          let i=0
          //处理表格数据
          this.tableData2.forEach(item=>{
            item.timestampRandomCode=datatime;
            item.machineId=this.machineId;
            if(item.planStatus==1){
              i++
            }
          })
          if(i>=1&&response.data.length>0){
            this.$message({
              message: '只能有一个产品的状态为上机',
              type: 'warning'
            });
            return;
          }else {
            //添加计划信息
            addSpinningPlanList(this.tableData2).then(response => {
              if (response.code == 200) {
                this.$message({
                  message: '添加成功',
                  type: 'success'
                });
                this.getSpinningPlanList();
                //最后把弹窗关掉
                this.nanInsertDialogTableVisible=false
              } else {
                this.$message({
                  message: '添加失败',
                  type: 'error'
                });
                //最后把弹窗关掉
                this.nanInsertDialogTableVisible=false
              }
            });
          }
      });
    },
    // 修改产品计划
    handleEditPlan(row) {
      //当前操作机台号
      this.machineId=row.machineId;
      this.tableData2=[];
      //弹窗
      this.nanUpdateDialogTableVisible = true
      getPlanSpinningInfo({"machineId":row.machineId}).then((response) => {
        //得到生产中，停产的，待产的
        response.data.forEach(item => {
          item.isEditing=false;
          item.planStatus=parseInt(item.planStatus);
          item.productId=parseInt(item.productId)
        })
        this.tableData2=response.data;
        console.log( this.tableData2)
        // 在数据加载完成后，手动触发每个行的第一个下拉框的 change 事件
        this.$nextTick(() => {
          // 获取第一个业务员选择框（假设表格只有一行）
          this.tableDataStatus=[];
          for (let i = 0; i < this.tableData2.length; i++) {
            const firstSalesmanSelect = this.$refs['salesmanSelect'+i];
            this.tableDataStatus.push({"index":i,"planStatus":this.tableData2[i].planStatus})
            // console.log(firstSalesmanSelect,11111111)
            // 触发 change 事件
            if (firstSalesmanSelect) {
              firstSalesmanSelect.$emit('change', {
                target: {value: "ddd"},
              });
            }
          }

        });
      })
    },
    //弹窗里边的点击查询
    onSubmit(){
      this.formData.machineId=this.machineId;
      getPlanSpinningInfo(this.formData).then(response => {
        //得到生产中，停产的，待产的
        response.data.forEach(item => {
          item.isEditing=false;
          item.planStatus=parseInt(item.planStatus);
        })
        this.tableData2=response.data;
      });
    },
    //重置
    reset(){
      getPlanSpinningInfo({"machineId":this.machineId}).then(response => {
        //得到生产中，停产的，待产的
        response.data.forEach(item => {
          item.isEditing=false;
          item.planStatus=parseInt(item.planStatus);
        })
        this.tableData2=response.data;
      });
    },
    //更新状态
    updateStatus(ind, row,planStatus){
      const a=planStatus;
      console.log( row.planStatus,this.tableDataStatus[ind].planStatus)
      if(planStatus==this.tableDataStatus[ind].planStatus){
        this.$message({
          message: '并未更改状态，不会发送请求',
          type: 'warning'
        });
        return;
      }
      //先查询计划表中有没有正在上机的
      getPlanSpinningInfo({"machineId":this.machineId,"planStatus":planStatus}).then(response => {
        let i=0
        //处理表格数据
        this.tableData2.forEach(item=>{
          item.machineId=this.machineId;
          if(item.planStatus==1){
            i++
          }
        })
        if(i>=1&&response.data.length>0){
          this.$message({
            message: '只能有一个产品的状态为上机',
            type: 'warning'
          });
          row.planStatus=planStatus;
          return;
        }else {
          updateSpinningInfoPlanOne(row).then(response=>{
            if (response.code == 200) {
              this.$message({
                message: '修改成功',
                type: 'success'
              });
              this.getSpinningPlanList();
              this.tableDataStatus=[]
              for (let i = 0; i < this.tableData2.length; i++) {
                this.tableDataStatus.push({"index": i, "planStatus": this.tableData2[i].planStatus})
              }
              //最后把弹窗关掉
              this.nanInsertDialogTableVisible=false
            } else {
              this.$message({
                message: '修改失败',
                type: 'error'
              });
              //最后把弹窗关掉
              this.nanInsertDialogTableVisible=false
            }
          })
        }
      });

    }
  },
  computed: {

  },
}
</script>

<style scoped>
.el-tabs--border-card >>> .el-tabs__content {
  padding: 0 !important;
}
.el-table__body-wrapper {
  cursor: grab;
}
.el-table__body-wrapper.grabbing {
  cursor: grabbing;
}
</style>