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

<template>
  <div class="app-container" style="width: 100%">
    <el-tabs
      type="border-card"
      @tab-click="tabClick"
      v-model="selectedWorkshop"
    >
      <!--南车间-->
      <el-tab-pane :label="$t('planTable.southWorkshop')" name="南车间">
        <!--表格-->
        <el-table :data="tableData" ref="tableRef" :span-method="spanMethod2">
          <el-table-column
            prop="machineId"
            fixed
            :label="$t('planTable.machineNo')"
            header-align="center"
            align="center"
            width="111px"
          ></el-table-column>
          <el-table-column
            prop="productType"
            fixed
            :label="$t('planTable.productCategory')"
            header-align="center"
            align="center"
            width="111.2px"
          ></el-table-column>
          <el-table-column :label="$t('planTable.inMachineProduct')" header-align="center">
            <el-table-column
              prop="productTypeName"
              fixed
              :label="$t('planTable.productType')"
              header-align="center"
              align="center"
              width="111.2px"
            ></el-table-column>
            <el-table-column
              prop="currentColorCode"
              :label="$t('planTable.colorNo')"
              header-align="center"
              width="90px"
              align="center"
            ></el-table-column>
            <el-table-column
              prop="currentSpecification"
              :label="$t('planTable.specification')"
              header-align="center"
              width="90px"
              align="center"
            ></el-table-column>
            <el-table-column
              prop="currentLotNumber"
              :label="$t('planTable.batchNo')"
              header-align="center"
              width="90px"
              align="center"
            ></el-table-column>
            <el-table-column
              prop="number"
              :label="$t('planTable.quantity')"
              header-align="center"
              width="90px"
              align="center"
            ></el-table-column>
            <el-table-column
              prop="currentSpindleCount"
              :label="$t('planTable.spindleCount')"
              header-align="center"
              width="90px"
              align="center"
            ></el-table-column>
            <el-table-column
              prop="startTime"
              :label="$t('planTable.startTime')"
              header-align="center"
              width="90px"
              align="center"
            ></el-table-column>
            <el-table-column
              prop="plannedEndTime"
              :label="$t('planTable.endTime')"
              header-align="center"
              width="90px"
              align="center"
            ></el-table-column>
          </el-table-column>
          <!--          <el-table-column  label="待上机产品" header-align="center" align="center">-->
          <!--            <el-table-column prop="djCurrentColorCode" label="色号" header-align="center" align="center"></el-table-column>-->
          <!--            <el-table-column prop="djCurrentSpecification" label="规格" header-align="center" align="center"></el-table-column>-->
          <!--            <el-table-column prop="djNumber" label="数量" header-align="center" align="center"></el-table-column>-->
          <!--            <el-table-column prop="djCurrentLotNumber" label="原丝批号" header-align="center" align="center"></el-table-column>-->
          <!--          </el-table-column>-->
          <el-table-column
            prop="listOfPendingProduction"
            :label="$t('planTable.pendingProductList')"
            header-align="center"
            align="center"
          >
            <template slot-scope="scope">
              <div v-if="scope.row.listOfPendingProduction">
                <span
                  v-for="(item, index) in scope.row.listOfPendingProduction.split(',')"
                  :key="index"
                >
                  {{ item }},
                  <br
                    v-if="
                      (index + 1) % 5 === 0 &&
                      index !==
                        scope.row.listOfPendingProduction.split(',').length - 1
                    "
                  />
                </span>
              </div>
            </template>
          </el-table-column>
          <el-table-column
            fixed="right"
            :label="$t('planTable.operation')"
            header-align="center"
            align="center"
            width="150px"
          >
            <template slot-scope="scope">
              <el-dropdown>
                <el-button type="primary">
                  {{ $t('planTable.operation') }}
                  <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)"
                    >{{ $t('planTable.addPlan') }}</el-dropdown-item
                  >
                  <el-dropdown-item
                    @click.native.prevent="handleEditPlan(scope.row)"
                    >{{ $t('planTable.editPlan') }}</el-dropdown-item
                  >
                </el-dropdown-menu>
              </el-dropdown>
            </template>
          </el-table-column>
        </el-table>
        <!--新增计划弹窗-->
        <el-dialog
          :title="$t('planTable.addPlanTitle')"
          :visible.sync="nanInsertDialogTableVisible"
          width="1500px"
        >
          <el-table :data="tableData2" @row-click.self="handleRowClick">
            <el-table-column
              prop="productId"
              :label="$t('planTable.product')"
              header-align="center"
              align="center"
              width="150px"
            >
              <template v-slot:default="scope">
                <el-select
                  filterable
                  v-model="scope.row.productId"
                  :placeholder="$t('planTable.selectProduct')"
                  @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="$t('planTable.colorNo')"
              header-align="center"
              align="center"
            >
              <template v-slot:default="scope">
                <el-select
                  v-model="scope.row.currentColorCode"
                  filterable
                  :placeholder="$t('planTable.selectColorCode')"
                  @change="selectedML(scope.row)"
                >
                  <el-option
                    v-for="(item, index) in options"
                    :key="index"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
                <!--                &lt;!&ndash; 如果当前行正在编辑，则显示输入框 &ndash;&gt;-->
                <!--                <el-input v-if="scope.row.isEditing"  v-model="scope.row.currentColorCode" placeholder="请输入色号" @blur.stop.prevent="handleInputBlur(scope.row)" ></el-input>-->
                <!--                &lt;!&ndash; 否则显示普通文本 &ndash;&gt;-->
                <!--                <span v-else>{{ scope.row.currentColorCode }}</span>-->
              </template>
            </el-table-column>
            <el-table-column
              prop="currentSpecification"
              :label="$t('planTable.specification')"
              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="$t('planTable.specification')"
                  @blur.stop.prevent="handleInputBlur(scope.row)"
                  >></el-input
                >
                <!-- 否则显示普通文本 -->
                <span v-else>{{ scope.row.currentSpecification }}</span>
              </template>
            </el-table-column>
            <el-table-column
              prop="productType"
              :label="$t('planTable.productCategory')"
              header-align="center"
              align="center"
              width="100px"
            >
              <template v-slot:default="scope">
                <el-select
                  v-model="scope.row.productType"
                  :placeholder="$t('planTable.selectCategory')"
                >
                  <el-option
                    v-for="product in productTypeList"
                    :key="product.value"
                    :label="product.lable"
                    :value="product.value"
                  ></el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column
              prop="currentLotNumber"
              :label="$t('planTable.batchNo')"
              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="$t('planTable.inputBatchNo')"
                  @blur.stop.prevent="handleInputBlur(scope.row)"
                  >></el-input
                >
                <span v-else>{{ scope.row.currentLotNumber }}</span>
              </template>
            </el-table-column>
            <!-- 新增筒重、箱重、管色字段 -->
            <el-table-column
              prop="tubeweight"
              label="筒重"
              header-align="center"
              align="center"
            >
              <template v-slot:default="scope">
                <el-select
                  v-model="scope.row.tubeweight"
                  clearable
                  filterable
                  allow-create
                  default-first-option
                >
                  <el-option
                    v-for="item in dropDownData.drum_weight"
                    :key="item.id"
                    :label="item.codeName"
                    :value="item.codeName"
                  >
                  </el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column
              prop="boxweight"
              label="箱重"
              header-align="center"
              align="center"
            >
              <template v-slot:default="scope">
                <el-select
                  v-model="scope.row.boxweight"
                  clearable
                  filterable
                  allow-create
                  default-first-option
                >
                  <el-option
                    v-for="item in dropDownData.box_weight"
                    :key="item.id"
                    :label="item.codeName"
                    :value="item.codeName"
                  >
                  </el-option>
                </el-select>
              </template>
            </el-table-column>



            <el-table-column
              prop="tubecolor"
              label="管色"
              header-align="center"
              align="center"
            >
              <template v-slot:default="scope">
                <el-select
                  v-model="scope.row.tubecolor"
                  clearable
                  filterable
                  allow-create
                  default-first-option
                >
                  <el-option
                    v-for="item in dropDownData.tube_color"
                    :key="item.id"
                    :label="item.codeName"
                    :value="item.codeName"
                  >
                  </el-option>
                </el-select>
              </template>
            </el-table-column>




            <!-- 新增筒重、箱重、管色字段 -->
            <el-table-column
              prop="currentSpindleCount"
              :label="$t('planTable.spindleCount')"
              header-align="center"
              align="center"
            >
              <template v-slot:default="scope">
                <el-input
                  v-if="scope.row.isEditing"
                  v-model="scope.row.currentSpindleCount"
                  :placeholder="$t('planTable.inputSpindleCount')"
                  @blur.stop.prevent="handleInputBlur(scope.row)"
                  >></el-input
                >
                <span v-else>{{ scope.row.currentSpindleCount }}</span>
              </template>
            </el-table-column>

            <el-table-column
              prop="number"
              :label="$t('planTable.quantity')"
              header-align="center"
              align="center"
            >
              <template v-slot:default="scope">
                <el-input
                  v-if="scope.row.isEditing"
                  v-model="scope.row.number"
                  :placeholder="$t('planTable.inputQuantity')"
                  @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="$t('planTable.startTime')"
              header-align="center"
              align="center"
            >
              <template v-slot:default="scope">
                <el-input
                  v-if="scope.row.isEditing"
                  v-model="scope.row.startTime"
                  :placeholder="$t('planTable.inputStartTime')"
                  @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="$t('planTable.endTime')"
              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="$t('planTable.inputEndTime')"
                  @blur="handleInputBlur(scope.row)"
                  >></el-input
                >
                <span v-else>{{ scope.row.plannedEndTime }}</span>
              </template>
            </el-table-column>
            <el-table-column
              prop="planStatus"
              :label="$t('planTable.planStatus')"
              header-align="center"
              align="center"
              width="100px"
            >
              <template v-slot:default="scope">
                <el-select
                  v-model="scope.row.planStatus"
                  :placeholder="$t('planTable.planStatus')"
                >
                  <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="$t('planTable.operation')">
              <template slot-scope="scope">
                <el-button
                  size="mini"
                  type="danger"
                  @click.stop.prevent="handleDelete(scope.$index, scope.row)"
                  >{{ $t('planTable.delete') }}</el-button
                >
              </template>
            </el-table-column>
          </el-table>
          <el-button
            type="primary"
            style="width: 100%; margin-top: 30px"
            @click="addEditableRow"
            >{{ $t('planTable.addPlanProduct') }}</el-button
          >
          <span slot="footer" class="dialog-footer">
            <el-button @click="nanInsertDialogTableVisible = false"
              >{{ $t('planTable.cancel') }}</el-button
            >
            <el-button type="primary" @click="addPlanInfo">{{ $t('planTable.confirm') }}</el-button>
          </span>
        </el-dialog>
        <!--修改计划弹窗-->
        <el-dialog
          :title="$t('planTable.editPlanTitle')"
          :visible.sync="nanUpdateDialogTableVisible"
          width="1500px"
        >
          <!--查询条件-->
          <el-form
            ref="form"
            :model="formData"
            label-width="80px"
            :inline="true"
          >
            <el-form-item :label="$t('planTable.productCategoryLabel')" prop="productType">
              <el-select
                v-model="formData.productType"
                :placeholder="$t('planTable.selectCategory')"
              >
                <el-option
                  v-for="product in productTypeList"
                  :key="product.value"
                  :label="product.lable"
                  :value="product.value"
                ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item :label="$t('planTable.planStatusLabel')" prop="planStatus">
              <el-select
                v-model="formData.planStatus"
                :placeholder="$t('planTable.planStatus')"
              >
                <el-option
                  v-for="stateListItem in stateList2"
                  :key="stateListItem.id"
                  :label="stateListItem.name"
                  :value="stateListItem.id"
                ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item>
              <el-button type="primary" @click="onSubmit">{{ $t('planTable.search') }}</el-button>
              <el-button @click="reset">{{ $t('planTable.reset') }}</el-button>
            </el-form-item>
          </el-form>
          <!--表格-->
          <el-table :data="tableData2" @row-click.self="handleRowClick">
            <el-table-column
              prop="productId"
              label="产品"
              header-align="center"
              align="center"
              width="150px"
            >
              <template slot-scope="scope">
                {{ getProductChineseName(scope.row.productId) }}
              </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="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="productType"
              label="产品类别"
              header-align="center"
              align="center"
              width="100px"
            >
              <template v-slot:default="scope">
                <el-select
                  v-model="scope.row.productType"
                  placeholder="请选择产品类别"
                >
                  <el-option
                    v-for="product in productTypeList"
                    :key="product.value"
                    :label="product.lable"
                    :value="product.value"
                  ></el-option>
                </el-select>
              </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="disabled"
                  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="tubeweight"
              label="筒重"
              header-align="center"
              align="center"
            >
              <template v-slot:default="scope">
                <el-select
                  v-model="scope.row.tubeweight"
                  clearable
                  filterable
                  allow-create
                  default-first-option
                >
                  <el-option
                    v-for="item in dropDownData.drum_weight"
                    :key="item.id"
                    :label="item.codeName"
                    :value="item.codeName"
                  >
                  </el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column
              prop="boxweight"
              label="箱重"
              header-align="center"
              align="center"
            >
              <template v-slot:default="scope">
                <el-select
                  v-model="scope.row.boxweight"
                  clearable
                  filterable
                  allow-create
                  default-first-option
                >
                  <el-option
                    v-for="item in dropDownData.box_weight"
                    :key="item.id"
                    :label="item.codeName"
                    :value="item.codeName"
                  >
                  </el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column
              prop="tubecolor"
              label="管色"
              header-align="center"
              align="center"
            >
              <template v-slot:default="scope">
                <el-select
                  v-model="scope.row.tubecolor"
                  clearable
                  filterable
                  allow-create
                  default-first-option
                >
                  <el-option
                    v-for="item in dropDownData.tube_color"
                    :key="item.id"
                    :label="item.codeName"
                    :value="item.codeName"
                  >
                  </el-option>
                </el-select>
              </template>
            </el-table-column>
            <!-- 新增筒重、箱重、管色字段 -->

            <el-table-column
              prop="currentSpindleCount"
              label="锭数"
              header-align="center"
              align="center"
            >
              <template v-slot:default="scope">
                <el-input
                  v-if="scope.row.isEditing"
                  v-model="scope.row.currentSpindleCount"
                  placeholder="请输入锭数"
                  @blur.stop.prevent="handleInputBlur(scope.row)"
                  >></el-input
                >
                <span v-else>{{ scope.row.currentSpindleCount }}</span>
              </template>
            </el-table-column>
            <el-table-column
              prop="number"
              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-if="scope.row.planStatus == 1"
                  v-model="scope.row.planStatus"
                  :placeholder="$t('planTable.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="$t('planTable.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="$t('planTable.planStatus')"
                >
                  <el-option
                    v-for="stateItem in stateList2"
                    :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 slot-scope="scope">
                <el-button
                  size="mini"
                  type="danger"
                  @click.stop.prevent="updateStatus(scope.$index, scope.row)"
                  >确认修改</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"
              >{{ $t('planTable.cancel') }}</el-button
            >
            <el-button
              type="primary"
              @click="nanUpdateDialogTableVisible = false"
              >{{ $t('planTable.confirm') }}</el-button
            >
          </span>
        </el-dialog>
      </el-tab-pane>
      <!--北车间-->
      <el-tab-pane :label="$t('planTable.northWorkshop')" name="北车间">
        <!--表格-->
        <el-table :data="tableData" ref="tableRef" :span-method="spanMethod2">
          <el-table-column
            prop="machineId"
            fixed
            :label="$t('planTable.machineNo')"
            header-align="center"
            align="center"
            width="111px"
          ></el-table-column>
          <el-table-column
            prop="productType"
            fixed
            :label="$t('planTable.productCategory')"
            header-align="center"
            align="center"
            width="111.2px"
          ></el-table-column>
          <el-table-column :label="$t('planTable.inMachineProduct')" header-align="center">
            <el-table-column
              prop="productTypeName"
              fixed
              :label="$t('planTable.productType')"
              header-align="center"
              align="center"
              width="111.2px"
            ></el-table-column>
            <el-table-column
              prop="currentColorCode"
              :label="$t('planTable.colorNo')"
              header-align="center"
              width="90px"
              align="center"
            ></el-table-column>
            <el-table-column
              prop="currentSpecification"
              :label="$t('planTable.specification')"
              header-align="center"
              width="90px"
              align="center"
            ></el-table-column>
            <el-table-column
              prop="currentLotNumber"
              :label="$t('planTable.batchNo')"
              header-align="center"
              width="90px"
              align="center"
            ></el-table-column>
            <el-table-column
              prop="number"
              :label="$t('planTable.quantity')"
              header-align="center"
              width="90px"
              align="center"
            ></el-table-column>
            <el-table-column
              prop="currentSpindleCount"
              :label="$t('planTable.spindleCount')"
              header-align="center"
              width="90px"
              align="center"
            ></el-table-column>
            <el-table-column
              prop="startTime"
              :label="$t('planTable.startTime')"
              header-align="center"
              width="90px"
              align="center"
            ></el-table-column>
            <el-table-column
              prop="plannedEndTime"
              :label="$t('planTable.endTime')"
              header-align="center"
              width="90px"
              align="center"
            ></el-table-column>
          </el-table-column>
          <el-table-column
            prop="listOfPendingProduction"
            :label="$t('planTable.pendingProductList')"
            header-align="center"
            align="center"
          >
            <template slot-scope="scope">
              <div v-if="scope.row.listOfPendingProduction">
                <div
                  v-for="(
                    item, index
                  ) in scope.row.listOfPendingProduction.split(',')"
                >
                  {{ item }}
                  <span
                    v-if="
                      (index + 1) % 5 === 0 &&
                      index !==
                        scope.row.listOfPendingProduction.split(',').length - 1
                    "
                    >,</span
                  >
                  <br
                    v-if="
                      (index + 1) % 5 === 0 &&
                      index !==
                        scope.row.listOfPendingProduction.split(',').length - 1
                    "
                  />
                </div>
              </div>
            </template>
          </el-table-column>
          <el-table-column
            fixed="right"
            :label="$t('planTable.operation')"
            header-align="center"
            align="center"
            width="150px"
          >
            <template slot-scope="scope">
              <el-dropdown>
                <el-button type="primary">
                  {{ $t('planTable.operation') }}
                  <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)"
                    >{{ $t('planTable.addPlan') }}</el-dropdown-item
                  >
                  <el-dropdown-item
                    @click.native.prevent="handleEditPlan(scope.row)"
                    >{{ $t('planTable.editPlan') }}</el-dropdown-item
                  >
                  <el-dropdown-item
                    @click.native.prevent="handleStopProductionLine(scope.row)"
                    >{{ $t('planTable.machineStatus') }}</el-dropdown-item
                  >
                </el-dropdown-menu>
              </el-dropdown>
            </template>
          </el-table-column>
        </el-table>
        <!--新增计划弹窗-->
        <el-dialog
          :title="$t('planTable.addPlanTitle')"
          :visible.sync="beiInsertDialogTableVisible"
          width="1500px"
        >
          <el-table :data="tableData2" @row-click.self="handleRowClick">
            <el-table-column
              prop="productId"
              :label="$t('planTable.product')"
              header-align="center"
              align="center"
              width="150px"
            >
              <template v-slot:default="scope">
                <el-select
                  filterable
                  v-model="scope.row.productId"
                  :placeholder="$t('planTable.selectProduct')"
                  @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="$t('planTable.colorNo')"
              header-align="center"
              align="center"
            >
              <template v-slot:default="scope">
                <el-select
                  v-model="scope.row.currentColorCode"
                  filterable
                  :placeholder="$t('planTable.selectColorCode')"
                  @change="selectedML(scope.row)"
                >
                  <el-option
                    v-for="(item, index) in options"
                    :key="index"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column
              prop="currentSpecification"
              :label="$t('planTable.specification')"
              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="$t('planTable.specification')"
                  @blur.stop.prevent="handleInputBlur(scope.row)"
                  >></el-input
                >
                <span v-else>{{ scope.row.currentSpecification }}</span>
              </template>
            </el-table-column>
            <el-table-column
              prop="productType"
              :label="$t('planTable.productCategory')"
              header-align="center"
              align="center"
              width="100px"
            >
              <template v-slot:default="scope">
                <el-select
                  v-model="scope.row.productType"
                  :placeholder="$t('planTable.selectCategory')"
                >
                  <el-option
                    v-for="product in productTypeList"
                    :key="product.value"
                    :label="product.lable"
                    :value="product.value"
                  ></el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column
              prop="currentLotNumber"
              :label="$t('planTable.batchNo')"
              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="$t('planTable.inputBatchNo')"
                  @blur.stop.prevent="handleInputBlur(scope.row)"
                  >></el-input
                >
                <span v-else>{{ scope.row.currentLotNumber }}</span>
              </template>
            </el-table-column>
            <!-- 新增筒重、箱重、管色字段 -->
            <el-table-column
              prop="tubeweight"
              label="筒重"
              header-align="center"
              align="center"
            >
              <template v-slot:default="scope">
                <el-select
                  v-model="scope.row.tubeweight"
                  clearable
                  filterable
                  allow-create
                  default-first-option
                >
                  <el-option
                    v-for="item in dropDownData.drum_weight"
                    :key="item.id"
                    :label="item.codeName"
                    :value="item.codeName"
                  >
                  </el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column
              prop="boxweight"
              label="箱重"
              header-align="center"
              align="center"
            >
              <template v-slot:default="scope">
                <el-select
                  v-model="scope.row.boxweight"
                  clearable
                  filterable
                  allow-create
                  default-first-option
                >
                  <el-option
                    v-for="item in dropDownData.box_weight"
                    :key="item.id"
                    :label="item.codeName"
                    :value="item.codeName"
                  >
                  </el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column
              prop="tubecolor"
              label="管色"
              header-align="center"
              align="center"
            >
              <template v-slot:default="scope">
                <el-select
                  v-model="scope.row.tubecolor"
                  clearable
                  filterable
                  allow-create
                  default-first-option
                >
                  <el-option
                    v-for="item in dropDownData.tube_color"
                    :key="item.id"
                    :label="item.codeName"
                    :value="item.codeName"
                  >
                  </el-option>
                </el-select>
              </template>
            </el-table-column>
            <!-- 新增筒重、箱重、管色字段 -->
            <el-table-column
              prop="currentSpindleCount"
              :label="$t('planTable.spindleCount')"
              header-align="center"
              align="center"
            >
              <template v-slot:default="scope">
                <el-input
                  v-if="scope.row.isEditing"
                  v-model="scope.row.currentSpindleCount"
                  :placeholder="$t('planTable.inputSpindleCount')"
                  @blur.stop.prevent="handleInputBlur(scope.row)"
                  >></el-input
                >
                <span v-else>{{ scope.row.currentSpindleCount }}</span>
              </template>
            </el-table-column>
            <el-table-column
              prop="number"
              :label="$t('planTable.quantity')"
              header-align="center"
              align="center"
            >
              <template v-slot:default="scope">
                <el-input
                  v-if="scope.row.isEditing"
                  v-model="scope.row.number"
                  :placeholder="$t('planTable.inputQuantity')"
                  @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="$t('planTable.startTime')"
              header-align="center"
              align="center"
            >
              <template v-slot:default="scope">
                <el-input
                  v-if="scope.row.isEditing"
                  v-model="scope.row.startTime"
                  :placeholder="$t('planTable.inputStartTime')"
                  @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="$t('planTable.endTime')"
              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="$t('planTable.inputEndTime')"
                  @blur="handleInputBlur(scope.row)"
                  >></el-input
                >
                <span v-else>{{ scope.row.plannedEndTime }}</span>
              </template>
            </el-table-column>
            <el-table-column
              prop="planStatus"
              :label="$t('planTable.planStatus')"
              header-align="center"
              align="center"
              width="100px"
            >
              <template v-slot:default="scope">
                <el-select
                  v-model="scope.row.planStatus"
                  :placeholder="$t('planTable.planStatus')"
                >
                  <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="$t('planTable.operation')">
              <template slot-scope="scope">
                <el-button
                  size="mini"
                  type="danger"
                  @click.stop.prevent="handleDelete(scope.$index, scope.row)"
                  >{{ $t('planTable.delete') }}</el-button
                >
              </template>
            </el-table-column>
          </el-table>
          <el-button
            type="primary"
            style="width: 100%; margin-top: 30px"
            @click="addEditableRow"
            >{{ $t('planTable.addPlanProduct') }}</el-button
          >
          <span slot="footer" class="dialog-footer">
            <el-button @click="beiInsertDialogTableVisible = false"
              >{{ $t('planTable.cancel') }}</el-button
            >
            <el-button type="primary" @click="addPlanInfo">{{ $t('planTable.confirm') }}</el-button>
          </span>
        </el-dialog>
        <!--修改计划弹窗-->
        <el-dialog
          :title="$t('planTable.editPlanTitle')"
          :visible.sync="beiUpdateDialogTableVisible"
          width="1500px"
        >
          <!--查询条件-->
          <el-form
            ref="form"
            :model="formData"
            label-width="80px"
            :inline="true"
          >
            <el-form-item :label="$t('planTable.productCategoryLabel')" prop="productType">
              <el-select
                filterable
                v-model="formData.productType"
                :placeholder="$t('planTable.selectCategory')"
              >
                <el-option
                  v-for="(product, index) in productTypeList"
                  :key="index"
                  :label="product.lable"
                  :value="product.value"
                ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item :label="$t('planTable.planStatusLabel')" prop="planStatus">
              <el-select
                v-model="formData.planStatus"
                :placeholder="$t('planTable.planStatus')"
              >
                <el-option
                  v-for="stateListItem in stateList2"
                  :key="stateListItem.id"
                  :label="stateListItem.name"
                  :value="stateListItem.id"
                ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item>
              <el-button type="primary" @click="onSubmit">{{ $t('planTable.search') }}</el-button>
              <el-button @click="reset">{{ $t('planTable.reset') }}</el-button>
            </el-form-item>
          </el-form>
          <!--表格-->
          <el-table :data="tableData2" @row-click.self="handleRowClick">
            <el-table-column
              prop="productId"
              label="产品"
              header-align="center"
              align="center"
              width="150px"
            >
              <template slot-scope="scope">
                {{ getProductChineseName(scope.row.productId) }}
              </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="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="productType"
              label="产品类别"
              header-align="center"
              align="center"
              width="100px"
            >
              <template v-slot:default="scope">
                <el-select
                  v-model="scope.row.productType"
                  placeholder="请选择产品类别"
                >
                  <el-option
                    v-for="product in productTypeList"
                    :key="product.value"
                    :label="product.lable"
                    :value="product.value"
                  ></el-option>
                </el-select>
              </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="disabled"
                  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="tubeweight"
              label="筒重"
              header-align="center"
              align="center"
            >
              <template v-slot:default="scope">
                <el-select
                  v-model="scope.row.tubeweight"
                  clearable
                  filterable
                  allow-create
                  default-first-option
                >
                  <el-option
                    v-for="item in dropDownData.drum_weight"
                    :key="item.id"
                    :label="item.codeName"
                    :value="item.codeName"
                  >
                  </el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column
              prop="boxweight"
              label="箱重"
              header-align="center"
              align="center"
            >
              <template v-slot:default="scope">
                <el-select
                  v-model="scope.row.boxweight"
                  clearable
                  filterable
                  allow-create
                  default-first-option
                >
                  <el-option
                    v-for="item in dropDownData.box_weight"
                    :key="item.id"
                    :label="item.codeName"
                    :value="item.codeName"
                  >
                  </el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column
              prop="tubecolor"
              label="管色"
              header-align="center"
              align="center"
            >
              <template v-slot:default="scope">
                <el-select
                  v-model="scope.row.tubecolor"
                  clearable
                  filterable
                  allow-create
                  default-first-option
                >
                  <el-option
                    v-for="item in dropDownData.tube_color"
                    :key="item.id"
                    :label="item.codeName"
                    :value="item.codeName"
                  >
                  </el-option>
                </el-select>
              </template>
            </el-table-column>
            <!-- 新增筒重、箱重、管色字段 -->
            <el-table-column
              prop="currentSpindleCount"
              label="锭数"
              header-align="center"
              align="center"
            >
              <template v-slot:default="scope">
                <el-input
                  v-if="scope.row.isEditing"
                  v-model="scope.row.currentSpindleCount"
                  placeholder="请输入锭数"
                  @blur.stop.prevent="handleInputBlur(scope.row)"
                  >></el-input
                >
                <span v-else>{{ scope.row.currentSpindleCount }}</span>
              </template>
            </el-table-column>
            <el-table-column
              prop="number"
              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"
              :placeholder="$t('planTable.planStatus')"
              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="$t('planTable.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="$t('planTable.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="$t('planTable.planStatus')"
                >
                  <el-option
                    v-for="stateItem in stateList2"
                    :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 slot-scope="scope">
                <el-button
                  size="mini"
                  type="danger"
                  @click.stop.prevent="updateStatus(scope.$index, scope.row)"
                  >确认修改</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="beiUpdateDialogTableVisible = false"
              >{{ $t('planTable.cancel') }}</el-button
            >
            <el-button
              type="primary"
              @click="beiUpdateDialogTableVisible = false"
              >{{ $t('planTable.confirm') }}</el-button
            >
          </span>
        </el-dialog>
      </el-tab-pane>
      <!--停机弹窗-->
      <el-dialog
        :title="$t('planTable.modifyMachineStatus')"
        :visible.sync="modifyMachineStatus"
        width="500px"
      >
        <el-form
          :model="modifyMachineStatusFrom"
          ref="modifyMachineStatusFrom"
          label-width="100px"
          class="demo-ruleForm"
        >
          <el-form-item :label="$t('planTable.machineStatus')" prop="type">
            <el-checkbox-group v-model="modifyMachineStatusFrom.type">
              <el-checkbox :key="1" label="1" name="type">{{ $t('planTable.stopSideA') }}</el-checkbox>
              <el-checkbox :key="2" label="2" name="type">{{ $t('planTable.stopSideB') }}</el-checkbox>
            </el-checkbox-group>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="confirmStopProductionLine"
              >{{ $t('planTable.confirm') }}</el-button
            >
            <el-button @click="tjqx">{{ $t('planTable.cancel') }}</el-button>
          </el-form-item>
        </el-form>
      </el-dialog>
    </el-tabs>
  </div>
</template>

<script>
import {
  ammunitionPlanInfo,
  getProductsInfo,
  removeBombLoadingPlan,
  getMaterielInfo,
  addMaterielInfo,
  getProductsAll,
  getOptionLsit,
  getAllPlanListByMachineId,
  getAllPlanListByProductTypeAndStatus,
  updatePlanOne,
  whetherTheFeederIsShutDown,
  updateLineStates,
  getIsTheOrderProductProduced,
  getJtIsTheOrderProductProduced,
  getCurrentProductionLineSuperior,
  updateSpinningInfoPlanOne
} from '@/api/plan/paln.js'

export default {
  data () {
    return {
      options: [],
      modifyMachineStatusFrom: {
        type: []
      },
      modifyMachineStatus: false,
      //选中的是那个车间
      selectedWorkshop: '南车间',
      tableData: [],
      isDisabled: true,
      form: {
        product: ''
      },
      formzdsj:{machineToolNo: "", //机台编号
        // 表单参数
        packaging: "", //包装
        machineTool: "", //机台
        workShifts: "", //班次
        productionDate: "", //生产日期
        levels: "", //等级
        foreignTradeNumber: "", //外贸号
        canisterWeight: "", //筒重
        boxWeight: "", //箱重-车重
        canisterNum: "", //筒数
        tubeColor: "", //管色
        comPort: "", //端口
        printFormat: "", //格式
        grossWeight: 0, //毛重
        remark: "", //备注
         },
      dropDownData: {},
      previousMachineId: undefined,
      currentRowspan: 1,
      prevRow: {},
      tableData2: [],
      nanInsertDialogTableVisible: false,
      nanUpdateDialogTableVisible: false,
      beiInsertDialogTableVisible: false,
      beiUpdateDialogTableVisible: false,
      editingRowIndex: -1,
      lastEditLine: 0,
      queryParams: {
        productionLineDepartment: '加弹部',
        productionLineWorkshop: '南车间'
      },
      isEditLine: false,
      productsInfo: [],
      salesmanInfo: [],
      product: {},
      materiel: {},
      // 机台号
      machineId: '',
      macId: '', //机台id
      // 待机/上机/停产
      stateList0: [
        { id: 0, name: this.$t('planTable.standby') },
        { id: 1, name: this.$t('planTable.inProduction') }
      ],
      stateList1: [
        { id: 0, name: this.$t('planTable.standby') },
        { id: 2, name: this.$t('planTable.stopped') },
        { id: 1, name: this.$t('planTable.inProduction') }
      ],
      stateList2: [
        { id: 0, name: this.$t('planTable.standby') },
        { id: 2, name: this.$t('planTable.stopped') },
        { id: 1, name: this.$t('planTable.inProduction') }
      ],
      formData: {
        updateSelectedProductCategory: '',
        updateSelectedProductState: ''
      },
      // 产品类别
      productTypeList: [
        { value: this.$t('planTable.sideA'), lable: this.$t('planTable.sideA') },
        { value: this.$t('planTable.sideB'), lable: this.$t('planTable.sideB') }
      ]
    }
  },
  mounted () {
    // 得到排产计划信息
    this.getAmmunitionPlanInfo()
    this.getSelectOptions()
  },
  methods: {
    tjqx () {
      this.modifyMachineStatus = false
    },
    getProductChineseName (productId) {
      console.log(productId, 'id')
      console.log(this.productsInfo, '数组内容')
      let aa = this.productsInfo.find(product => {
        return product.id === productId
      })
      console.log('找到了', aa)
      return aa.productName
    },
    selectedML (row) {
      console.log(row.currentColorCode)
      if (row.currentColorCode) {
        let tarName = this.options.find(
          item => item.value == row.currentColorCode
        ).colourNumber
        console.log('aaaaa=============', tarName)
        row.colourNumber = tarName
        console.log('aaaaa=============', row)
      }
    },
    //删除计划
    deletePlan ($index, row) {
      console.log(row)
      //判断当前计划是否已经投产
      getJtIsTheOrderProductProduced({ id: row.id }).then(resp => {
        if (resp.data.length > 0) {
          this.$message({
            message: this.$t('planTable.currentPlanInProduction'),
            type: 'warning'
          })
          return //证明有在上级的产品--zhi能有一个上级产品
        }
        removeBombLoadingPlan(row.id).then(res => {
          if (res.code == 200) {
            this.$message({
              message: this.$t('planTable.deleteSuccess'),
              type: 'success'
            })
          } else {
            this.$message({ message: this.$t('planTable.deleteFailed'), type: 'error' })
          }
          this.onSubmit()
          this.getAmmunitionPlanInfo()
        })
      })
    },
    //打开修改机台信息
    handleStopProductionLine (row) {
      this.modifyMachineStatus = true
      this.machineId = row.machineId
      this.macId = row.macId //机台id
      //查询当前机台A、面B面的状态
      whetherTheFeederIsShutDown(this.macId).then(res => {
        this.modifyMachineStatusFrom.type = res.data
      })
    },
    //确认修改产线信息
    confirmStopProductionLine () {
      // console.log(this.modifyMachineStatusFrom.type);
      if (this.modifyMachineStatusFrom.type.length == 0) {
        this.modifyMachineStatusFrom.type.push('3')
      }
      //更改状态
      updateLineStates(
        this.macId,
        this.modifyMachineStatusFrom.type.join(',')
      ).then(res => {
        if (res.code == 200) {
          this.$message({
            message: this.$t('planTable.modifyStatusSuccess'),
            type: 'success'
          })
        } else {
          this.$message({ message: this.$t('planTable.modifyStatusFailed'), type: 'error' })

        }
        this.modifyMachineStatus = false
        this.getAmmunitionPlanInfo()
        this.editingRowIndex = -1 // 重置编辑行索引
        this.tableData2.forEach(item => {
          item.isEditing = false // 重置所有行的编辑状态
        })
      })

      // //如果为空代表都不停机
      // if(this.modifyMachineStatusFrom.type.length<=0){
      //   this.modifyMachineStatus=false;
      //   //发送请求删除,A面-timestampRandomCode="停机" B-timestampRandomCode="停机"的数据、并把所有上机产品的状态改为上机
      //   return;
      // }
      // // 包含1A停机---插入一条 timestampRandomCode=停机,状态为停机的数据
      // if (this.modifyMachineStatusFrom.type.includes("1")) {
      //     //查询当前机台A、面B面的状态
      //     whetherTheFeederIsShutDown(this.machineId).then(res=>{
      //      //后台没有虚拟的假数据，就插入
      //      if(!res.data.includes("1")){
      //        console.log('数组中不包含数字 1');
      //        //新增一条数据,
      //        let aStopInfo=   {
      //          currentColorCode: '1',
      //          //产品规格
      //          currentSpecification: '1',
      //          currentLotNumber: '1',
      //          currentSpindleCount: '1',
      //          number: '1',
      //          productType:'A面',
      //          startTime: '1',
      //          plannedEndTime:'1',
      //          planStatus:2,
      //          productId:'1',
      //          machineId:this.machineId,
      //          salesmanId:'1',
      //          timestampRandomCode:"停机",
      //        }
      //        let aStoptableList=[];
      //        aStoptableList.push(aStopInfo)
      //        //时间戳
      //        let data={
      //          //机台号
      //          machineId: this.machineId,
      //          //计划信息
      //          detailsOfTheRefuelingPlans: aStoptableList
      //        }
      //        //添加计划信息
      //        addMaterielInfo(data).then(response => {
      //          if (response.code == 200) {
      //            this.$message({
      //              message: '停机成功',
      //              type: 'success'
      //            });
      //            this.getAmmunitionPlanInfo();
      //            //最后把弹窗关掉
      //            this.nanInsertDialogTableVisible=false
      //            //更改订单投产信息的批号,
      //          } else {
      //            this.$message({
      //              message: '停机失败,请联系管理员',
      //              type: 'error'
      //            });
      //            //最后把弹窗关掉
      //            this.nanInsertDialogTableVisible=false
      //          }
      //        });
      //      }
      //     })
      // }
      // if(this.modifyMachineStatusFrom.type.includes("2")) {
      //   whetherTheFeederIsShutDown(this.machineId).then(res=>{
      //     if(!res.data.includes("2")) {
      //       console.log('数组中不包含数字2');
      //       //新增一条数据,
      //       let aStopInfo= {
      //         currentColorCode: '1',
      //         //产品规格
      //         currentSpecification: '1',
      //         currentLotNumber: '1',
      //         currentSpindleCount: '1',
      //         number: '1',
      //         productType:'B面',
      //         startTime: '1',
      //         plannedEndTime:'1',
      //         planStatus:2,
      //         productId:'1',
      //         machineId:this.machineId,
      //         salesmanId:'1',
      //         timestampRandomCode:"停机",
      //       }
      //       let aStoptableList=[];
      //       aStoptableList.push(aStopInfo)
      //       //时间戳
      //       let data={
      //         //机台号
      //         machineId: this.machineId,
      //         //计划信息
      //         detailsOfTheRefuelingPlans: aStoptableList
      //       }
      //       //添加计划信息
      //       addMaterielInfo(data).then(response => {
      //         if (response.code == 200) {
      //           this.$message({
      //             message: '停机成功',
      //             type: 'success'
      //           });
      //           this.getAmmunitionPlanInfo();
      //           //最后把弹窗关掉
      //           this.nanInsertDialogTableVisible=false
      //           //更改订单投产信息的批号,
      //         } else {
      //           this.$message({
      //             message: '停机失败,请联系管理员',
      //             type: 'error'
      //           });
      //           //最后把弹窗关掉
      //           this.nanInsertDialogTableVisible=false
      //         }
      //       });
      //     }
      //   })
      // }
    },
    // 查询排产信息
    getAmmunitionPlanInfo () {
      ammunitionPlanInfo(this.queryParams).then(response => {
        this.tableData = response.data
      })
    },
    // 合并单元格
    spanMethod2 ({ row, column, rowIndex, columnIndex }) {
      //第二列合并
      if (columnIndex === 1) {
        if (row.productType == null) {
          return
        }
        const prevRow2 = this.tableData[rowIndex - 1] // 上一行数据
        let nextRow2 = this.tableData[rowIndex + 1] // 下一行数据

        // 当上一行的数据（machineId和productType）等于当前行数据时，当前行单元格隐藏
        if (
          prevRow2 &&
          prevRow2.machineId === row.machineId &&
          prevRow2.productType === row.productType
        ) {
          return { rowspan: 0, colspan: 0 }
        } else {
          // 反之，则循环判断若下一行数据（machineId和productType）等于当前行数据，则当前行开始进行合并单元格
          let countRowspan2 = 1 // 用于合并计数多少单元格
          while (
            nextRow2 &&
            nextRow2.machineId === row.machineId &&
            nextRow2.productType === row.productType
          ) {
            nextRow2 = this.tableData[++countRowspan2 + rowIndex]
          }
          if (countRowspan2 > 1) {
            return { rowspan: countRowspan2, colspan: 1 }
          }
        }
      }
      //待生产列表
      if (columnIndex === 9) {
        const prevRow2 = this.tableData[rowIndex - 1] //上一行数据
        let nextRow2 = this.tableData[rowIndex + 1] //下一行数据
        // 当上一行的数据等于当前行数据时，当前行单元格隐藏

        if (
          row.listOfPendingProduction == null ||
          row.listOfPendingProduction == undefined ||
          row.listOfPendingProduction == ''
        ) {
          return
        }
        if (
          prevRow2 &&
          prevRow2.machineId === row.machineId &&
          prevRow2.productType === row.productType
        ) {
          return { rowspan: 0, colspan: 0 }
        } else {
          // 反之，则循环判断若下一行数据等于当前行数据，则当前行开始进行合并单元格
          let countRowspan2 = 1 //用于合并计数多少单元格
          while (
            nextRow2 &&
            nextRow2.listOfPendingProduction === row.listOfPendingProduction &&
            nextRow2.machineId === row.machineId &&
            nextRow2.productType === row.productType
          ) {
            nextRow2 = this.tableData[++countRowspan2 + rowIndex]
          }
          if (countRowspan2 > 1) {
            return { rowspan: countRowspan2, colspan: 1 }
          }
        }
      }
      //合并最后一列操作列
      const lastColumnIndex =
        this.$refs.tableRef.store.states.columns.length - 1 // 获取表格最后一列的索引
      if (columnIndex === lastColumnIndex && column.label === '操作') {
        // 判断是否为最后一列且标签为'操作'
        const machineIdColumnIndex = 0 // 机台号列的索引假定为0
        const currentMachineId = row.machineId

        let countRowspan = 1
        const prevRow = this.tableData[rowIndex - 1]

        if (prevRow && prevRow.machineId === currentMachineId) {
          return { rowspan: 0, colspan: 0 }
        } else {
          let nextRow = this.tableData[rowIndex + 1]

          while (nextRow && nextRow.machineId === currentMachineId) {
            nextRow = this.tableData[++countRowspan + rowIndex]
          }

          if (countRowspan > 1) {
            return { rowspan: countRowspan, colspan: 1 }
          }
        }
      }
      //第一列机台号合并
      if (columnIndex === 0) {
        //定义需要合并的列字段，有哪些列需要合并，就自定义添加字段即可
        const fields = ['machineId']
        // 当前行的数据
        const cellValue = row[column.property]
        let countRowspan = 1 //用于合并计数多少单元格
        // 判断只合并定义字段的列数据
        if (cellValue && fields.includes(column.property)) {
          const prevRow = this.tableData[rowIndex - 1] //上一行数据
          let nextRow = this.tableData[rowIndex + 1] //下一行数据
          // 当上一行的数据等于当前行数据时，当前行单元格隐藏
          if (prevRow && prevRow[column.property] === cellValue) {
            return { rowspan: 0, colspan: 0 }
          } else {
            // 反之，则循环判断若下一行数据等于当前行数据，则当前行开始进行合并单元格
            let countRowspan = 1 //用于合并计数多少单元格
            while (nextRow && nextRow[column.property] === cellValue) {
              nextRow = this.tableData[++countRowspan + rowIndex]
            }
            if (countRowspan > 1) {
              return { rowspan: countRowspan, colspan: 1 }
            }
          }
        }
      }
    },
    getProductsInfo () {
      getProductsInfo('JT-').then(response => {
        this.productsInfo = response.data
        console.log('hmcxzz', this.productsInfo)
        this.productsInfo.forEach(item => {
          // item.productName = item.productName+"—"+item.materieEncoding+item.materieColorNumber
          item.productName = item.productName + '—' + item.colours
        })
      })
    },
    // 下拉框数据改变查询色号批号信息
    selectedChangeDate (row, selectedProduct) {
      this.options = []
      //选择的那个销售产品
      this.product = this.productsInfo.find(
        product => product.id === selectedProduct
      )
      this.form.product = selectedProduct
      //通过母粒编码查询到对应的母粒信息
      let queryParams = {
        // "materielCode": this.product.colourNumber,
        materielSpecies: '1'
      }
      //得到对应的母粒信息
      getMaterielInfo(queryParams).then(response => {
        if (response.data != null) {
          let mls = response.data
          mls.forEach(dataKey => {
            this.options.push({
              label:
                dataKey.materieEncoding +
                '(' +
                dataKey.materieColorNumber +
                ')',
              value:
                dataKey.materieEncoding +
                '(' +
                dataKey.materieColorNumber +
                ')',
              colourNumber: dataKey.materielCode
            })
          })
          //色号 母粒编码+色号
          // 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.currentLotNumber = ''
      }
      //产品规格
      row.currentSpecification = this.product.productSpecifications
      //销售单编号（以前打算存的是业务员信息后来存的是销售单编号）
      row.salesmanId = this.product.saleOrderNo
      //数量
      row.number = this.product.productNumber
      // console.log(this.product,'ddddddddddddddd')
    },
    // 新增计划产品信息
    handleAddPlan (row) {
      //查询当前机台A、面B面的状态(这个不用改,因为这个是唯一的)
      whetherTheFeederIsShutDown(row.macId).then(res => {
        this.modifyMachineStatusFrom.type = res.data
        if (
          this.modifyMachineStatusFrom.type.includes('2') &&
          this.modifyMachineStatusFrom.type.includes('1')
        ) {
          this.$message({
            message: this.$t('planTable.bothSidesStopped'),
            type: 'warning'
          })
          return
        } else {
          if (this.modifyMachineStatusFrom.type.includes('1')) {
            this.productTypeList = []
            this.productTypeList.push({ value: 'B面', lable: 'B面' })
          }
          if (this.modifyMachineStatusFrom.type.includes('2')) {
            this.productTypeList = []
            this.productTypeList.push({ value: 'A面', lable: 'A面' })
          }
          if (this.modifyMachineStatusFrom.type.length <= 0) {
            this.productTypeList = []
            this.productTypeList.push({ value: 'A面', lable: 'A面' })
            this.productTypeList.push({ value: 'B面', lable: 'B面' })
          }
          //否则就打开弹窗添加计划
          if (this.selectedWorkshop == '南车间') {
            this.nanInsertDialogTableVisible = true
          } else {
            this.beiInsertDialogTableVisible = true
          }
          //查询可以添加的产品信息
          this.getProductsInfo()
          //清空添加的数组对象
          this.tableData2 = []
          //先清空
          this.machineId = ''
          //当前操作机台号
          this.machineId = row.machineId
          this.macId = row.macId
        }
      })
    },
    // tab栏点击切换
    tabClick (tab, event) {
      // console.log('当前点击的标签名称：', tab.name);
      this.selectedWorkshop = tab.name
      // productionLineName getProductionLineNo productionLineDepartment productionLineWorkshop
      this.queryParams.productionLineWorkshop = tab.name
      this.getAmmunitionPlanInfo()
    },
    // 删除行
    handleDelete (index, row) {
      // console.log(index,row)
      // this.tableData2[a];
      this.tableData2.splice(index, 1)
      // 把上一编辑行置回-1
      this.editingRowIndex = -1
    },
    // 点击编辑行
    handleRowClick (row) {
      this.isEditLine = true
      // alert(this.lastEditLine + '编辑行1')
      //找到当前行的编辑索引
      let rowIndex = this.tableData2.indexOf(row)
      // alert(rowIndex + '编辑行2')
      if (
        this.lastEditLine != 0 &&
        this.editingRowIndex !== rowIndex &&
        this.editingRowIndex !== -1 &&
        !this.isRowFilled(this.tableData2[this.lastEditLine])
      ) {
        this.$message({
          message: this.$t('planTable.completePreviousData'),
          type: 'warning'
        })
        return
      }
      //编辑索引不等于当前编辑行索引
      console.log(this.editingRowIndex, rowIndex, 'yxxxxxxxxxxx')
      if (this.editingRowIndex !== rowIndex) {
        // alert(this.editingRowIndex);
        if (this.editingRowIndex !== -1) {
          //把当前行变成不可编辑的
          this.tableData2[this.editingRowIndex].isEditing = false
        }
        //把当前行变成可编辑的
        row.isEditing = true
        this.editingRowIndex = rowIndex
      } else {
      }
    },
    // 光标失去焦点变成不可编辑
    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.currentSpindleCount &&
        row.currentColorCode &&
        row.productType &&
        row.currentLotNumber &&
        row.number &&
        row.tubecolor &&
        row.boxweight &&
        row.tubeweight
      )
    },
    // 新增一行标记为可编辑
    addEditableRow () {
      // 检查当前编辑行是否已填写完毕
      if (this.tableData2.length != 0) {
        if (
          this.editingRowIndex !== -1 &&
          !this.isRowFilled(this.tableData2[this.editingRowIndex])
        ) {
          this.$message({
            message: this.$t('planTable.completePreviousData'),
            type: 'warning'
          })
          return
        }
        //新增行之前先让以前的行不能编辑
        this.tableData2.forEach(item => {
          item.isEditing = false
        })
      }
      this.tableData2.push({
        currentColorCode: '',
        currentSpecification: '',
        currentLotNumber: '',
        currentSpindleCount: '',
        number: '',
        startTime: '',
        plannedEndTime: '',
        planStatus: 0,
        productId: '',
        salesmanId: '',
        isEditing: true, // 标记为正在编辑状态
        colourNumber: ''
      })
      this.editingRowIndex = this.tableData2.length - 1 // 更新当前编辑的行索引
      this.lastEditLine = this.tableData2.length - 1
    },
    // 添加计划
    addPlanInfo () {
      if (this.tableData2.length > 0) {
        var flag = true
        this.tableData2.forEach(item => {
          if (!this.isRowFilled(item)) {
            this.$message({
              message: this.$t('planTable.completeTableData'),
              type: 'warning'
            })
            flag = false
          }
        })
        if (flag) {
          const datatime = Date.now() + this.machineId
          //处理表格数据
          this.tableData2.forEach(item => {
            item.timestampRandomCode = datatime
            item.machineId = this.machineId
          })
          //时间戳
          let data = {
            //机台号
            machineId: this.machineId,
            macId: this.macId,
            timestampRandomCode: datatime,
            //计划信息
            detailsOfTheRefuelingPlans: this.tableData2
          }
          //添加计划信息
          addMaterielInfo(data).then(response => {
            if (response.code == 200) {
              this.$message({
                message: this.$t('planTable.addSuccess'),
                type: 'success'
              })
              this.getAmmunitionPlanInfo()
              //最后把弹窗关掉
              this.nanInsertDialogTableVisible = false
              this.beiInsertDialogTableVisible = false
              //更改订单投产信息的批号,
            } else {
              this.$message({
                message: this.$t('planTable.addFailed'),
                type: 'error'
              })
              this.nanInsertDialogTableVisible = false
              this.beiInsertDialogTableVisible = false
              //最后把弹窗关掉
            }
          })
        }
      } else {
        this.$message({
          message: this.$t('planTable.addTableData'),
          type: 'warning'
        })
        return
      }
    },
    // 修改产品计划
    handleEditPlan (row) {
      //已经在待机列表了，isNull过滤掉了
      getProductsAll(row.macId).then(response => {
        this.productsInfo = response.data
        this.productsInfo.forEach(item => {
          item.productName =
            item.productName +
            '—' +
            item.materieEncoding +
            item.materieColorNumber
        })
        this.tableData2 = []
        //弹窗
        if (this.selectedWorkshop == '南车间') {
          this.nanUpdateDialogTableVisible = true
        } else {
          this.beiUpdateDialogTableVisible = true
        }
        //先清空--当前操作机台号
        this.machineId = ''
        this.machineId = row.machineId
        this.macId = row.macId
        //查询当前机台下的计划信息
        getAllPlanListByMachineId(this.macId).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, 'abc/abc')
        })
        // 重置编辑行索引
        this.editingRowIndex = -1
        // 重置所有行的编辑状态
        this.tableData2.forEach(item => {
          item.isEditing = false
        })
      })
    },
    //重置按钮
    reset () {
      this.formData.productType = ''
      this.formData.planStatus = ''

      this.tableData2 = []
      //弹窗
      if (this.selectedWorkshop == '南车间') {
        this.nanUpdateDialogTableVisible = true
      } else {
        this.beiUpdateDialogTableVisible = true
      }

      console.log(this.macId, 'dddd')
      getAllPlanListByMachineId(this.macId).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(() => {
        //   // 获取第一个业务员选择框（假设表格只有一行）
        //   for (let i = 0; i < this.tableData2.length; i++) {
        //     const firstSalesmanSelect = this.$refs['salesmanSelect'+i];
        //     // 触发 change 事件
        //     if (firstSalesmanSelect) {
        //       firstSalesmanSelect.$emit('change', {
        //         target: {value: "ddd"},
        //       });
        //     }
        //   }
        // });
      })
    },
    // 获取下拉数据
    async getSelectOptions() {
      try {
        let res = await getOptionLsit();
        if (res.code == 200) {
          this.dropDownData = res.data || {};
          // 初始化默认值
          if (
            this.dropDownData.work_shifts?.length > 0 &&
            this.excuteType == 1
          ) {
            this.formzdsj.workShifts = this.dropDownData.work_shifts[0].codeName;
          }
          if (this.dropDownData.level?.length > 0 && this.excuteType == 1) {
            this.formzdsj.levels = this.dropDownData.level[0].codeName;
          }
          if (
            this.dropDownData.drum_weight?.length > 0 &&
            this.excuteType == 1
          ) {
            this.formzdsj.canisterWeight =
              this.dropDownData.drum_weight[0].codeName;
          }
          if (
            this.dropDownData.box_weight?.length > 0 &&
            this.excuteType == 1
          ) {
            this.formzdsj.boxWeight = this.dropDownData.box_weight[0].codeName;
          }
          if (
            this.dropDownData.tube_color?.length > 0 &&
            this.excuteType == 1
          ) {
            this.formzdsj.tubeColor = this.dropDownData.tube_color[0].codeName;
          }
        } else {
          this.$message.error("网络异常!");
        }
      } catch (error) {}
    },
    //弹窗里边的点击查询
    onSubmit () {
      this.formData.macId = this.macId
      getAllPlanListByProductTypeAndStatus(this.formData).then(response => {
        //得到生产中，停产的，待产的
        response.data.forEach(item => {
          item.isEditing = false
          item.planStatus = parseInt(item.planStatus)
        })
        this.tableData2 = response.data
      })
    },
    //更新状态
    updateStatus (ind, row) {
      if (!this.isRowFilled(row)) {
        this.$message({ message: this.$t('planTable.completeCurrentRow'), type: 'warning' })
        return
      }
      //判断当前计划是否已经投产
      getJtIsTheOrderProductProduced({ id: row.id }).then(resp => {
        // if(resp.data.length>0) {
        //   this.$message({message: '当前计划订单产品在生产中已经不能修改', type: 'warning'});
        //   return;//证明有在上级的产品--zhi能有一个上级产品
        // }
        //不是生产中中就可以更新了.
        updatePlanOne(row).then(response => {
          if (response.code == 200) {
            this.$message({
              message: this.$t('planTable.modifySuccess'),
              type: 'success'
            })
            this.getAmmunitionPlanInfo()
          } else {
            this.$message({
              message: this.$t('planTable.modifyFailed'),
              type: 'error'
            })
          }
          //关闭弹窗
          this.nanInsertDialogTableVisible = false
          this.beiUpdateDialogTableVisible = false
          this.editingRowIndex = -1 // 重置编辑行索引
          this.tableData2.forEach(item => {
            item.isEditing = false // 重置所有行的编辑状态
          })
        })
      })
    }
  }
}
</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;
}
.container >>> .el-table .cell {
  white-space: pre-line;
}
</style>